<!DOCTYPE html><html><head> <title>JS Flash</title> <meta charset="utf-8"> <style type="text/css"> body,div,span{ margin: 0; padding: 0;}#div1{ width: 200px; height: 200px; background: red; position: relative; left: -200px; top:0; }#div1 span{ width: 20px; height: 50px; background: blue; position: absolute; left: 200px; top: 75px;} </style> <script type="text/javascript"> window.onload=function(){ var oDiv=document.getElementById('div1'); oDiv.onmouseover=function(){ startMove(); } oDiv.onmouseover = function(){ startMove1(); } } var timer=null; function startMove(){ clearInterval(timer); setInterval(function(){ var oDiv=document.getElementById('div1'); if(oDiv.offsetLeft == 0){ clearInterval(timer); } else{ oDiv.style.left=oDiv.offsetLeft+10+'px'; } },30) } function startMove1(){ clearInterval(timer); setInterval(function(){ var oDiv=document.getElementById('div1'); if(oDiv.offsetLeft == -200){ clearInterval(timer); } else{ oDiv.style.left=oDiv.offsetLeft-10+'px'; } },30) } </script></head><body><div id="div1"> <span id="share">分享</span></div></body></html>
3 回答
已采纳
李晓健
TA贡献1036条经验 获得超461个赞
oDiv.onmouseover=function(){
startMove();
}
oDiv.onmouseover = function(){
startMove1();
}
//因为后面一个onmouseover 会覆盖前面一个 onmouseover ，所以你就看不到效果
点击展开后面2条
添加回答
举报
0/150
提交
取消