问一下哪里错了
ASDDSAFAS
2017-07-05 11:15
<!DOCTYPE html>
<html>
<head>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
<meta charset="UTF-8">
<title>JS缓冲动画</title>
<style type="text/css">
body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div,dl,dt,
dd,input{margin:0;padding:0;}
body{font-size:12px;}
img{border:none;}
li{list-style:none;}
input,select,textarea{outline:none;}
textarea{resize:none;}
#div1{
height: 200px;
width: 200px;
background-color: red;
position: relative;
left: -200px;
top: 0;
}
#div1 span{
background-color: blue;
width:20px;
height: 50px;
position: absolute;
left: 200px;
top: 75px;
}
</style>
<script type="text/javascript">
window.onload=function(){
var oDiv=document.getElementById('div1');
oDiv.onmouseover=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)/30;
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>
<script type="text/javascript">
</script>
<div id="div1" ><span id="share">分享</span></div>
</body>
</html>
3回答
-
- qq_终究落下_04415476
- 2017-07-05 15:29:50
你把那些定义speed 的内容放在setInterval()里面试一试
-
- qq_终究落下_04415476
- 2017-07-18 12:02:36
不定义里面怎么循环
-
- fighting中
- 2017-07-12 10:34:48
定义在外面相当于一个值，定义在里面才能循环。
JS动画效果
113925 学习 · 1443 问题
相似问题