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

1、用JS实现轮播图效果(二)_ 这篇文章主要介绍了用JS实现轮播图效果（二）的相关资料,需要的伴侣可以参考下 js代码如下： window.onload = function() /轮播初始化 var lunbo = document.getElementById(content); var imgs = lunbo.getElementsByTagName(img); var uls = lunbo.getElementsByTagName(ul); var lis = lunbo.getElementsByTagName(li); var next = document.getElement

2、ById(next); var prev = document.getElementById(prev); var item = 0; /初始状态下，一个圆圈为高亮模式 lis0.style.fontSize = 26px; lis0.style.color = #fff; imgs0.style.display = block; /定义一个全局变量，用来进行自动轮播图片挨次的改变 var pic_index = 1; /自动轮播.用法pic_time记录播放，可以随时用法clearInterval()清除掉。 var pic_time = setInterval(autobofang,100

3、0); /自动播放的大事处理 function autobofang() if(pic_index = lis.length) pic_index = 0; picChange(pic_index); pic_index+; /手动轮播 for(var i=0;ilis.length;i+) lisi.addEventListener(mouseover,change,false); function change(event) var event=event|window.event; var target=event.target|event.srcElement; var childre

4、n = target.parentNode.children; for(var i=0;ichildren.length;i+) if(target = childreni) picChange(i); /图片切换函数 function picChange(i) /让全部图片都不显示，全部圆圈都为一般样式 for(var j=0;jimgs.length;j+) imgsj.style.display = none; lisj.style.fontSize = 24px; lisj.style.color = #999; /让选中的索引的图片显示，对应的圆圈高亮 imgsi.style.dis

5、play = block; lisi.style.fontSize = 26px; lisi.style.color = #fff; /当鼠标移近图片区域内，自动播放停止 lunbo.addEventListener(mouseover,function() clearInterval(pic_time); ,false); /当鼠标移出图片区域内，自动播放连续 lunbo.addEventListener(mouseout,function()pic_time = setInterval(autobofang,1000); ,false); /后退箭头点击大事，图片会跟着点击大事不断改变 next.addEventListener(click,movenext,false); function movenext() if(item = 2) item=0; else item+=1; picChange(item); prev.addEventListener(click,moveprev,false); function moveprev() if(item =