setInterval还是hover有延迟?请各位大师花一分钟帮我看看,谢谢

自己写了个小动画,注释掉的部分是第二种方法,没延迟
怎么下面这种动画有延迟,请大师们帮帮忙

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>test</title>
<link href="" rel="stylesheet">
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<style>
.main{width: 1024px;margin: 0 auto}
.bar{width: 300px;height: 300px;background: blue;position: relative;}
.bar button{position: absolute;bottom: 10px;right: 20px;}
 </style>   


<body>
 <div class="main">
     <div class="bar"><button class="go">go</button></div>
 </div>
 <script>

 var item=$('.bar button');
 var t;
     $('.bar').hover(function() {
    t=setInterval("go()",800);    
    }, function() {
        clearInterval(t);
    });

function go(){
        item.animate({right: 50},400, function(){
            item.animate({right:20}, 400)
        });
    }
    
// $('.bar').hover(function() {
//     go(item)
// }, function() {
//     clearInterval(t)
// });    
// function go(i){
//     i.animate({right: 50},400, function() {
//         i.animate({right:20}, 400)
//     });
//     t=setInterval(function(){
//         i.animate({right: 50},400, function() {
//         i.animate({right:20}, 400)
//     });
//     },800)
// }

 </script>
</body>
</html>
阅读 2.2k
2 个回答

是不是写反了?我试验的结果是第一种有延迟第二种没有。
第一种延迟的原因是

t=setInterval(function(){go()},800);

至少800毫秒以后才会执行动画函数

你的第二种方法都直接运行了,当然没延时

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题