请问这个BUG是什么情况？http://www.imooc.com/video/2879
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
#divs {
height: 260px;
width: 160px;
background-color: antiquewhite;
border-radius: 10px;
position: relative;
left: -160px;
}
#spans {
height: 100px;
width: 20px;
background-color: cornflowerblue;
border-radius: 5px;
position: absolute;
left: 160px;
margin-left: 1px;
box-shadow: 5px 2px 10px cornflowerblue;
border: 1px solid white;
}
#div_opacity {
height: 100px;
width: 100px;
background-color: brown;
border-radius: 100px;
box-shadow: 5px 2px 10px #A52A2A;
border: 1px solid white;
opacity: 0.1;
}
</style>
<script type="text/javascript">
window.onload = function() {
var div = document.getElementById("divs"),
span = document.getElementById("spans"),
div_o = document.getElementById("div_opacity");
var speed = 5;
div.onmouseover = function() {
star_1(speed, div, 0);
}
div.onmouseleave = function() {
star_1(speed, div, -160);
}
}
var timer = null;
function star_1(speed, div, itarget) {
clearInterval(timer);
timer = setInterval(function() {
if (div.offsetLeft == itarget) {
clearInterval(timer);
} else {
if (itarget == 0) {
speed = speed;
} else if (itarget<0) {
speed = -speed;
}
if (div.offsetLeft > -160 / 2) {
speed = speed * 3;
} else {
speed = speed;
}
div.style.left = div.offsetLeft + speed + "px";
//解决抖动
if (div.offsetLeft > 0) {
clearInterval(timer);
div.style.left = "0px";
}
if (div.offsetLeft < -160) {
clearInterval(timer);
div.style.left = "-160px";
}
}
}, 50)
}
</script>
</head>
<body>
<div id="divs"><span id="spans">分享</span></div>
<div id="div_opacity"></div>
</body>
</html>在代码的第68行，”speed=-speed“，当onmouseleave事件触发，div就会不停弹跳。
如果是改成”speed=-5“就不会出错，请问这是发生了啥？蟹蟹
