看到一个js鼠标滚动图片切换的dome，在Firefox上正常，别的浏览器就跳着切换。 财富值82

2016-10-21 19:12发布

站内问答 /
787 0 6

如题，最近学习鼠标滚动事件，这是在网上看到的dome，想了很久都没想到那出问题了，特来请教。代码如下：

<!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8"> <title>鼠标通过滚动滚轮切换图片</title>   <style>   #picBox{       width:800px;height:600px;       margin:70px auto;       }   </style>   <script>       var nowPic=1;       function MouseWheel(e){           var pic;           e=e||window.event;           for(i=1;i<4;i++){               if(i==nowPic){                   if(e.wheelDelta){//IE                       pic=document.getElementById("pic"+i);                       pic.style.display="block";                   }                 else if(e.detail){//Firefox                       pic=document.getElementById("pic"+i);                       pic.style.display="block";                   }                   }else{                       pic=document.getElementById("pic"+i);                       pic.style.display="none";                      }               }                  if(nowPic>=3){                   nowPic=1;               }else{                   nowPic++;               }           }       /*Firefox注册事件*/       if(document.addEventListener){           document.addEventListener("DOMMouseScroll",MouseWheel,false);       }       window.onmousewheel=document.onmousewheel=MouseWheel;//IE/Opera/Chrome   </script>   </head>      <body>       <h3 align="center">鼠标通过滚动滚轮切换图片</h3>       <div id="picBox">           <img src="http://picm.bbzhi.com/dongwubizhi/dongwuheji/dongwuheji_69803_m.jpg" width="800px" height="600px" id="pic1">           <span style="white-space:pre"></span>         <img src="http://pic1a.nipic.com/2008-12-22/2008122204359187_2.jpg" width="800px" height="600px" id="pic2" style="display:none;">           <span style="white-space:pre"></span>         <img src="http://imgphoto.gmw.cn/attachement/jpg/site2/20121221/002564a60ce4123e17614e.jpg" width="800px" height="600px" id="pic3" style="display:none;">       </div>   </body>   </html>
友情提示: 问题已经关闭,关闭后问题禁止继续编辑，回答。
该问题目前已经被作者或者管理员关闭, 无法添加新回复
0条回答

一周热门 更多>