<强>使用方法
<人力资源/> js
<代码> $(函数(){
var slideBox=$ (“.slideBox”);
var ul=slideBox.find (“ul”);
var oneWidth=slideBox。找到(李“ul”) .eq (0) .width ();
var num=slideBox.find (”。spanBox跨度”);
var=$("长度。slideBox ul李”). length;
var length02=$ ("。.length-1 slideBox ul李”);
var计时器=零;
var sw=0;//每个跨度绑定点击事件,完成切换颜色和动画,以及读取参数的值
num.on(“点击”,函数(){
sw=$(这).index ();
ul.animate ({
“正确”:oneWidth *西南
});
$("。spanBox跨度”).removeClass(“活跃”);
$("。spanBox跨度”).eq (sw) .addClass(“活跃”);
});//左右按钮的控制效果
$ (" .prev ") .click(函数(){
clearInterval(计时器);
sw + +;
如果(sw> length02)
{
sw=length02;
}
ul.animate ({
“正确”:oneWidth *西南
});
$("。spanBox跨度”).removeClass(“活跃”);
$("。spanBox跨度”).eq (sw) .addClass(“活跃”);
});
$(“第二”).click(函数(){
clearInterval(计时器);
sw——;
如果(sw<0)
{
sw=0;
}
ul.animate ({
“正确”:oneWidth *西南
});
$("。spanBox跨度”).removeClass(“活跃”);
$("。spanBox跨度”).eq (sw) .addClass(“活跃”);
});//定时器的使用,自动开始
计时器=setInterval(函数(){
sw + +;
如果长度(sw==) {sw=0};
num.eq (sw) .trigger(“点击”);
}, 2000);//选中是去除定时器
$ (" .slideBox ") .hover(函数(){
clearInterval(计时器);
},函数(){
计时器=setInterval(函数(){
sw + +;
如果(sw==num.length) {sw=0};
num.eq (sw) .trigger(“点击”);
}, 2000);
}）
});
本插件的原理不过是加载js以后往页面里插入几个节点,非常简单,使用者可以修改源码来获得自己想要的效果
预览地址:http://www.jquery66.com/demos/js/j70/index.html
下载链接:https://u18725144.ctfile.com/fs/18725144 - 330281670
