这是可运行的源码：<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>缓冲动画</title> <style type="text/css"> body{padding: 0px;margin:0px;} #div1{ height: 200px; width: 200px; background: #abcedf; position: relative; left: -200px; } #share{ display: block; height: 150px; width: 50px; background: #666; position: absolute; left: 200px; top: 20px; } </style></head><body> <div id="div1"> <span id="share">分享</span> </div> <ul> <li>定时器</li> </ul> <script type="text/javascript"> window.onload = function(){ var oDiv = document.getElementById("div1"); oDiv.onmouseover = function(){ getIn(0);//写目的地,不是起点 } oDiv.onmouseout = function(){ getIn(-200);//写目的地,不是起点 } timer=null; function getIn(iTarget){ clearInterval(timer); timer = setInterval(function(){ var speed = 0; if(oDiv.offsetLeft<iTarget){ speed = 10; }else{ speed = -10; } if(iTarget == oDiv.offsetLeft){ clearInterval(timer); }else{ oDiv.style.left = oDiv.offsetLeft + speed+"px"; //可否调换？ } },30) } } </script></body></html>我在调换了JS结尾的代码结果是oDiv没有移动,console没有报错,于是我决定试试这两者分别会弹出什么左图oDiv.offsetLeft是-200可以理解,为什么右图弹出空白？我用typeof查了发现是string,有没有朋友解释下为什么这里是空字符串？
添加回答
举报
0/150
提交
取消