请问这样的代码:为什么鼠标移出div后,方块没有缩回去

来源:2-1 JS速度动画

virusos

2017-04-11 19:35

鼠标移出后,红色部分会突然消失,然后又出现,并没有缩回屏幕外


var div1 = document.getElementById('div1'),

share = document.getElementById('share'),

timer = null;


window.onload = function(){

var div1 = document.getElementById('div1');

div1.onmouseover = function(){

startMove();

};

div1.onmouseout = function(){

div1.style.left = -200 + 'px';            //这里

};

}


function startMove(){

var div1 = document.getElementById('div1');

clearInterval(timer);

timer = setInterval(function(){

if(div1.offsetLeft != 0){

div1.style.left = div1.offsetLeft + 10 + 'px';

}

}, 30);

}


写回答 关注

1回答

  • 哈哈嘿k
    2017-04-11 21:18:02

    因为你的定时器一直在运行,,你应该在它完全出来之后,,清理掉在运行的这个定时器,,

    if(div1.offsetLeft != 0){

    div1.style.left = div1.offsetLeft + 10 + 'px';

    } else {

    clearInterval(timer);

    }


JS动画效果

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

113925 学习 · 1443 问题

查看课程

相似问题