求解这段代码的问题在哪?

来源:2-1 JS速度动画

总角晏晏

2015-06-15 14:05

<script type=text/javascript>

window.onload=function(){

var od1=document.getElementById("d1");

        od1.onmouseover=function (){

orun(10,0);

}

od1.onmouseout=function(){

orun(-10,-200);

}

}

var timer=null;

function orun(speed,iend){

clearInterval(timer);

var od1=document.getElementById("d1");

   timer=setInterval(function(){

if (od1.offsetLeft==iend){

clearInterval(timer);

}

else 

{

od1.style.left=od1.offsetLeft+speed+'px';

}

   },30)

}

</script>

一是向右动起来为什么不会停而向左却可以停。

二是向右和向左移动的速度为什么明显不一样。谢谢

写回答 关注

1回答

  • wy57
    2015-06-15 14:55:44
    1. od1.offsetLeft==iend,首先確定你這個對象的初始位置(如果大於0),則向右移動始終不會停;而向左移動時當位置為-200時,則停止。

    2. od1.style.left=od1.offsetLeft+speed+'px';.offsetLeft這個屬性表示當前對象到父類對象的距離,向右移動時距離變大速度快了;向左移動時距離變小速度慢了。

JS动画效果

通过本课程JS动画的学习,从简单动画开始,逐步深入各种动画框架封装

113923 学习 · 1443 问题

查看课程

相似问题