jQuery 3D立体螺旋动画焦点图切换插件

视觉效果非常吸睛的一款jQuery3D立体螺旋动画焦点图切换插件，图片切换方式类似垂直的螺旋叶片旋转。

js代码
<scriptsrc="jquery-1.11.3.min.js"></script>
<scripttype="text/javascript">
$(function(){
varnum=0;
$("#j_silder_outer.img-item").each(function(index,el){
$(this).css({
"left":$(this).width()*index+"px",
/*让每个img-item延时一定时间执行动画*/
"transitionDelay":index*0.3+"s"
});
$(this).find(".img").css({
"backgroundPosition":-$(this).width()*index+"px"
});;
});$(".prev").on("click",function(){
$("#j_silder_outer.img-item").css("transform","rotateX("+(++num*90)+"deg)");
});$(".next").on("click",function(){
$("#j_silder_outer.img-item").css("transform","rotateX("+(--num*90)+"deg)");
});

vartimejg=4000;//轮播间隔时间
vartime=setInterval(move,timejg);
functionmove(){
$("#j_silder_outer.img-item").css("transform","rotateX("+(--num*90)+"deg)");
}
$('.slider-outer').hover(function(){
clearInterval(time);
},function(){
time=setInterval(move,timejg);
});
})
</script>



下载

2023-11-23 00:06 上传

点击文件名下载附件
售价: 1 金币  [记录]  [购买]