js控制一个div移动,当鼠标移动到该div上停止移动,我只做出了移动,求大神指导停止。

function move(){
var d = document;
var db = document.body;
var div = d.getElementById("movediv");//移动的div在html里命名的id为movediv
var timer;
var x=3,y=3;
var ds = div.style;
timer = setInterval(function (){
//步长写死为5px
if(div.offsetWidth+div.offsetLeft>=db.clientWidth){
x=-x;
}
else if(div.offsetHeight+div.offsetTop>=db.clientHeight){
y=-y;
}
else if(div.offsetLeft<=0){
x=3;
}
else if(div.offsetTop<=0){
y=3;
}
ds.left=(div.offsetLeft+x) + 'px';
ds.top =(div.offsetTop+y) + 'px';

},40);
}
function stop() {
//这就是要实现停止的方法
}

move()方法是在body的onload="move()"调用的,stop()期望在移动的div中用onmouseover="stop()"调用

<body onload="move()">
<div id="movediv" onmouseout="move()" onmouseover="stop()"></div>
<script type="text/javascript">
var timer;
function move(){
,,,,,
}
function stop() {//这就是要实现停止的方法
clearInterval(timer);
}

timer要定义在外边,这样stop中才可以用

温馨提示:答案为网友推荐,仅供参考
第1个回答  推荐于2018-03-10
window.onload=function(){
    var div = document.getElementById("movediv");
    move();
    div.onmouseover=function(){stop();};
}
function stop(){
    clearInterval(timer);
}

由于作用域问题,你得在window对象的onload事件句柄中再获取一下div对象。

追问

你的也可以,很感谢你!!

追答

不客气~

本回答被网友采纳
相似回答