SpriteSpin 一款图像360度旋转的jquery插件

在 web 页面上使用 jQuery 图像 360 度旋转插件是最美也是最方便的显示图像的方式。这些超级棒的 360° 图像选择插件允许用户更详细的分析产品或者文章。jQuery 图像旋转插件可以让用户从各种角度进行 360 度的图像展示，经常在电子商务网站上使用，帮助消费者更好的了解产品，从任意的一个角度观察欣赏。
Spritespin 是个 jQuery 插件，允许在网页上显示 sprite 动画。只需要用户提供一组图像，或者一系列无缝的 sprite 列表，就可以逐帧显示这些图像，然后生成动画。SpriteSpin变成图像帧成动画。它需要的图像或stiched精灵表的一个数组，并像一个翻转书帧播放这些帧。这个插件的目的是提供任何一种产品的一个360度的视角。SpriteSpin依赖了jQuery 1.4.2框架及更高版本。

<script type="text/javascript">
  $(function(){
    $('.spritespin').spritespin({
      // generate an array of image urls.
      // this is a helper function that takes a {frame} placeholder
      source: SpriteSpin.sourceArray('/images/rad_zoom_{frame}.jpg', {
        // 这里是图片路径
        frame: [1,34],
        // 这里是图片开始到最后一张图片的数量
        digits: 3  //这里有{frame}是3位数字  比如rad_zoom_001.jpg
      }),
      // Specify the display width and height of the frame.
      // Optionally the size of the container can be defined with CSS.
      width: 480,
      height: 327,
      // Sense controls the direction and speed of the animation for mouse/touch interactions.
      // Here a negative value is chosen to invert the rotation, so the animation 'follows' the drag direction.
      // Values towards 0 will slow the animation down.
      sense: -1
    });
  });
</script>

<div class="spritespin"></div>

在线演示：http://spritespin.ginie.eu/