基于Threejs的jQuery 3d图片旋转木马特效插件

这是一款基于ThreeJS的炫酷3D旋转木马图片画廊特效插件。该旋转木马特效可以设置图片预加载，带有前后导航按钮，可以使用鼠标前后旋转，并可以设置3D透视的位置。

查看演示   在线下载  201504091855.zip

该旋转木马依赖于以下外部插件：

• Three.js：https://github.com/mrdoob/three.js/
• Stats.js：https://github.com/mrdoob/stats.js/
• TweenMax：http://www.greensock.com/gsap-js/
• PreloadJS：http://www.createjs.com/#!/PreloadJS
  

浏览器兼容

• Firefox - 30.0.0 +
• Chrome - 35.0.0 +
• Explorer: 9 +
• Ipad Safari: 7.0.0 +
• Iphone Safari: 7.0.0 +
• IOS Safari: 7.0.0 +
• Android Chrome: 未测试
• IOS Chrome: 未测试
  

使用方法
HTML结构

该旋转木马插件的HTML结构使用一个空的<div>即可。

1. <div class="box"></div>           

复制代码

在调用插件之前要引入所有的外部依赖文件。然后可以使用下面的方法调用该旋转木马插件：

1. $(function(){
   
2.   $(".box").ig3js({
   
3.       manifest: [
   
4.           {src:"image1.jpg", id:"image1"},
   
5.           {src:"image2.jpg", id:"image2"},
   
6.           {src:"image3.jpg", id:"image3"},
   
7.           {src:"image4.jpg", id:"image4"},
   
8.           {src:"image5.jpg", id:"image5"},
   
9.           {src:"image6.jpg", id:"image6"},
   
10.           {src:"image7.jpg", id:"image7"}
    
11.         ],
    
12.         imagePath: 'images/'
    
13.     });
    
14. });         

复制代码

配置参数

事件

方法

via:http://www.htmleaf.com/jQuery/Sl ... r/201504091651.html