鼠标移入事件不对

<!doctype html><html> <head> <title>轮播图</title> <style type="text/css"> *{ margin:0;padding:0; } #body{ width:642px; } #aa{ width:642px; height:383px; border:1px solid red; margin:0 auto; position:relative; } #aa img{ width:642; height:383px; display:none; position:absolute; left:0; top:0; } #aa ul{ list-style:none; position:absolute; left:156px; bottom:20px; } #aa ul li{ width:50px; height:50px; border-radius:50%; background:black; float:left; margin-right:20px; } </style> <script type="text/javascript"> window.onload = function(){ //容器对象(圆角//（50*5）250+（20*4）80=330 642-330=312/2=156） var aaobj = document.getElementById('aa'); //获得图片对象集合 var imgobj = aaobj.getElementsByTagName('img'); var liobj = aaobj.getElementsByTagName('li'); //设置样式 //设置一个总管变量 c=0; imgobj[0].style.display='block'; liobj[0].style.background='red'; //设置定时器 timer=setInterval(run,1000); function run(){ c++; if(c==imgobj.length){ c=0; } for(var i=0;i<imgobj.length;i++){ imgobj[i].style.display='none'; liobj[i].style.background='black'; } imgobj[c].style.display='block'; liobj[c].style.background='red'; } //做成函数 for(var i=0;i<imgobj.length;i++){ liobj[i].wz=i; liobj[i].mouseover=function(){ clearInterval(timer);//关闭定时器 c=this.wz; for(var i=0;i<imgobj.length;i++){ imgobj[i].style.display='none'; liobj[i].style.background='black'; } } imgobj[c].style.display='block'; liobj[c].style.background='red'; } liobj[i].onmouseout=function(){ timer=setInterval(run,1000); } } </script> </head> <body> <div id="aa"> <img src="images/1.jpg" style="display:block;"/> <img src="images/2.jpg"/> <img src="images/3.jpg"/> <img src="images/4.jpg"/> <img src="images/5.jpg"/> <ul> <li style="background:red;"></li> <li></li> <li></li> <li></li> <li></li> </ul> </div> </body></html>

查看完整描述

3 回答

热搜

最近搜索清空

鼠标移入事件不对

鼠标移入事件不对

3 回答

添加回答