spritespin.js插件实现图片360度旋转

1. 官网：http://spritespin.ginie.eu/；

SpriteSpin是一个jQuery插件，可将图像帧转换为动画。它需要一个图像阵列或一个精确的精灵片，并像翻转书一样逐帧播放它们。此插件的目的是提供任何类型产品的360度视图。该插件的构建具有可扩展性，并允许Web开发人员定制动画的行为和表示.

2. 下载引用：

        方法1  ：npm install spritespin； import SpriteSpin from "spritespin" ;

        方法2  ：

        方法3  ：

3. 具体步骤：

    3.1  为SpriteSpin创建一个容器：

；

    3.2 初始化插件：

注意：在滑动图片360度旋转时，不能有其他div图层样式遮挡住spriteSpin插件的容器，

如果存在遮挡的div图层样式，可以为遮挡的div图层添加属性pionter-enents:none，阻止其默认事件。

案例：

 

 

 

如果有问题，或者有错误，欢迎指正，共同进步，前端技术交流qq群740034288

转载于:https://my.oschina.net/u/3824391/blog/1824301