码迷,mamicode.com
首页 > 其他好文 > 详细

轮播图

时间:2016-11-30 22:31:47      阅读:140      评论:0      收藏:0      [点我收藏+]

标签:cli   显示   change   set   index   addclass   tin   size   rem   

$(document).ready(function(){
var aPage = $(‘#show .page a‘); //分页按钮
var aImg = $(‘#show #banner img‘); //图像集合
var iSize = aImg.size(); //图像个数
var index = 0; //切换索引
//分页按钮点击
aPage.click(function(){
index = $(this).index();
change(index);
});
//切换过程
function change(index){
aPage.removeClass(‘active‘);
aPage.eq(index).addClass(‘active‘);
//隐藏除了当前元素,所以图像
aImg.eq(index).siblings().animate({opacity:0},1000);
//显示当前图像
aImg.eq(index).animate({opacity:1},1000);
}
function autoshow() {
index=index+1;
if(index<=iSize-1){
change(index);
}else{
index=0;
change(index);
}
}
int=setInterval(autoshow,3000);
})

轮播图

标签:cli   显示   change   set   index   addclass   tin   size   rem   

原文地址:http://www.cnblogs.com/lanmaochanchanshuibuxing/p/6119472.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!