【JS速度動畫】選中框的代碼的+10+那里,發現將10換成其他數字(比如7),為什么div的運動就會超出我設的限制條件的無限持續下去
<html>
<head>
<meta charset="utf-8">
<style>
?#div1 {
? ? ? ? ? ? width: 380px;
? ? ? ? ? ? height: 247px;
? ? ? ? ? ? left: -380px;
? ? ? ? ? ? top: 0px;
? ? ? ? ? ? position: absolute;
? ? ? ? ? ? border: 1px solid #ccc;
? ? ? ? ? ? background: green;
? ? ? ? ? ? -moz-border-radius: 10px;
? ? ? ? ? ? -webkit-border-radius: 10px;
? ? ? ? ? ? border-radius: 10px;
? ? ? ? ? ? -moz-box-shadow: 0 0 8px #000;
? ? ? ? ? ? -webkit-box-shadow: 0 0 8px #000;
? ? ? ? ? ? box-shadow: 0 0 8px #000;
? ? ? ? }
#span1 ? {
? ? ? ? ? ?width: 30px;
? ? ? ? ? ? height: 80px;
? ? ? ? ? ? left: 380px;
? ? ? ? ? ? top: 168px;
? ? ? ? ? ? position: absolute;
? ? ? ? ? ? background: #567;
? ? ? ? ? ?-moz-border-radius: 10px;
? ? ? ? ? ? -webkit-border-radius: 10px;
? ? ? ? ? ? border-radius: 3px;
? ? ? ? ? ? -moz-box-shadow: 0 0 8px #000;
? ? ? ? ? ? -webkit-box-shadow: 0 0 8px #000;
? ? ? ? ? ? box-shadow: 0 0 8px #000;
? ? ? ? }
#p1 ? ? ?{color: ? #fff;}
</style>
</head>
<body>
<div id="div1"><span id="span1"><p id="p1">分享到</p></span></div>
<script>
//加載即運行的始祖根函數
window.onload=function()
{
var div1=document.getElementById("div1"),
? ? span1=document.getElementById("span1")
? ? timer=null
?
? ?div1.onmouseover=function()
? ?{
? ? startMove();
? ?}
? ?
function startMove()
{?
clearInterval(timer)
? ? ?
timer=setInterval(function()
{?
? ? ? ? ? div1=document.getElementById("div1")
? ? ? ? ? if(div1.offsetLeft==0)
?{clearInterval(timer);}
?else
?{div1.style.left=div1.offsetLeft+10+'px';}
?
},30)
}
}
</script>
</body>
</html>
2016-03-19
因為7是除不盡的??if(div1.offsetLeft==0) 條件不可能成立,所以不行,