js插件3d图片轮播，可以控制图片数量的(只有四张图片)

JavaScript025

js插件3d图片轮播，可以控制图片数量的(只有四张图片),第1张

漂亮jQuery 3D动画图片轮播切换特效插件jquery.slicebox.js，基于jQuery，插件采用CSS 3D

动画效果，支持事件Callback调用，支持参数自定义配置，如：

speed：600 切换速度、autoplay:true

是否自动播放，在浏览器兼容方面，需要浏览器支持CSS3变换变形属性，不支持的将看不到3D特效！

用js来修改图片路径实现轮播是不太可取的一种办法，通常的做法是：

把需要轮播的图片全部罗列出来，用js控制轮流显示第几张图片，

EX：

html代码：

<div id="lunbo">

<div id="img1" class="img"><img src="**"></div>

<div id="img2" class="img"><img src="**"></div>

<div id="img3" class="img"><img src="**"></div>

</div>

css代码：

#lunbo{width:100%height:300pxposition:relativezoom:1overflow:hidden}

#lunbo div{width:100%height:100%position:absoluteleft:0top:0display:none}

#lunbo div:first-child{display:block}

img{width:100%height:100%border:0display:block}

js代码：

<script type="text/javascript">

var t=0

setInterval(function(){

t++

if(t>2)t=0

document.querySelector(".img").style.display="none"

document.querySelector("#img"+t.toString()).style.display="block"

},5000)

</script>