用JS实现轮播图效果(二).docx

这篇文章主要介绍了用 JS实现轮播图效果(二)的相关资料,需要的朋友可以参考下js代码如下:=function(){//轮播初始化varlunbo=('content');varimgs=('img');varuls=('ul');varlis=('li');varnext=('next');varprev=('prev');varitem=0;II初始状态下,一个圆圈为高亮模式lis[0].='26px:lis[0].='#fff;imgs[0].='block';〃定义一个全局变量,用来进行自动轮播图片顺序的变化varpic_index=1;,可以随时使用clearlnterval()清除掉。varpic_time=setlnterval(autobofang,1000);II自动播放的事件处理functionautobofang(){if(pic_index>=){pic_index=0;}hange(pic_index);pic_index++;}II手动轮播for(vari=0;i<;i++){lis[i].addEventListener("mouseover",change,false);}functionchange(event){varevent=event||;vartarget=||;varchildren=;for(vari=0;i<;i++){if(target==children[i]){hange(i);}}}//hange(i){//让所有图片都不显示,所有圆圈都为普通样式for(varj=O;j<;j++){imgs[j].='none';lis[j].='24px:lis[j].='#999:}〃让选中的索引的图片显示,对应的圆圈高亮imgs[i].='block';lis[i].='26px';lis[i].styl