为什么动画无法停止呢
qq_雍坚_0
2017-03-04 22:09
<!DOCTYPE html>
<meta charset="utf-8">
<title>速度动画</title>
<html>
<head>
<style type="text/css">
#div1{width: 200px;height: 200px;background: red;position: relative;;left: -200px;top: 0px;cursor: pointer;}
#share{height: 50px;width: 20px; background: blue;position: absolute;right: -20px;top: 75px;line-height: 20px;text-align: center;color: white;}
</style>
</head>
<body>
<div id="div1">
<span id="share">分享</span>
</div>
</body>
<script type="text/javascript">
window.onload = function(){
startmove();
}
var aniTime = null;
function startmove(target){
var oDiv = document.getElementById('div1');
oDiv.onmouseover = function(){
clearInterval(aniTime);
aniTime = setInterval(function(){
if (oDiv.offsetLeft < target) {
clearInterval(aniTime);
}
else{
oDiv.style.left = oDiv.offsetLeft+1+'px';
}
},30);
}
}
</script>
</html>
1回答
-
- 熊的力量
- 2017-03-04 23:14:32
判断oDiv.offsetLeft和target的时候判断条件是等于不是小于
JS动画效果
113925 学习 · 1443 问题
相似问题