为了账号安全,请及时绑定邮箱和手机立即绑定

缓冲代码在firefox上运行正常,但在360浏览器中有时候会无限左移和右移?

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{
margin:0;
padding: 0;
}
     #div1{
      background:red;
      width: 200px;
      height:200px;
      left:-200px;
      position: relative;
     }
     #share{
        position: absolute;
        display: block;
        left:200px;
        width:50px;
        height:75px;
        top:20px;
        background: green;
     }
</style>
<script>
window.onload = function(){
var oDiv =document.getElementById('div1');
oDiv.onmousemove = function(){
startMove(0);
}
oDiv.onmouseout = function(){
startMove(-200);
}
var timer = null;
function startMove(iTarget){
clearInterval(timer);
var oDiv =document.getElementById('div1');
var speed = (iTarget-oDiv.offsetLeft)/5;
speed = speed>0?Math.ceil(speed):Math.floor(speed);
timer = setInterval(function(){
if(oDiv.offsetLeft ==iTarget){
clearInterval(timer);
}else{
oDiv.style.left = oDiv.offsetLeft+speed+"px";
}
},30)
}
}
</script>
</head>
<body>
<div id="div1">
<span id ="share">分享</span>
</div>
</body>
</html>

在360上实验5次总会有一次会无限漂移,firefox上实验十多次一点问题都没有

正在回答

2 回答

var speed = (iTarget-oDiv.offsetLeft)/5;
speed = speed>0?Math.ceil(speed):Math.floor(speed);

speed的定义这段代码要放到定时器内部函数里去

0 回复 有任何疑惑可以回复我~
#1

图图眼白 提问者

非常感谢!
2016-04-06 回复 有任何疑惑可以回复我~
#2

tanglj22

可不可以讲一下这样放置的原理~我也出现了同LZ一样的问题。
2016-05-29 回复 有任何疑惑可以回复我~
#3

二师弟 回复 tanglj22

我觉得是因为在定时器内部,oDiv.style.left = oDiv.offsetLeft+speed+"px";这个语句在不断更改着speed的值,但是如果它的定义写在定时器外部,每次运行定时器函数的时候,speed的值就会重新调用它初次执行时被赋予的值。
2016-06-12 回复 有任何疑惑可以回复我~

firefox上也重现了Orz

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

缓冲代码在firefox上运行正常,但在360浏览器中有时候会无限左移和右移?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信