javascript - 一段时间后(比如100毫秒)自动调用JS函数

Question

我不希望 div 在鼠标事件 mouseOver() 或 mouseOut() 上产生动画效果。我希望 div 自动(连续)为自己设置动画...

这是我的代码的 JFiddle... http://jsfiddle.net/UxtJV/610/

HTML

<div class=circle1></div>

CSS

.circle1 {
position:absolute; top:50px; left:50px;
width: 0px; height: 0px;
border:1px solid red;
padding:20px;
border-radius:50%;
}

JS

$(".circle1").mouseover(function() {
  $(this).animate({top:"0", left:"0", width:"100px", height:"100px", opacity: 0}, 200);
});
$(".circle1").mouseout(function() {
  $(this).animate({top:"50px", left:"50px", width:"0", height:"0", opacity: 1}, 200);
});

Answer 1

您需要自行调整时间。间隔时间不能短于超时时间，否则整个事情就会变得困惑。

$(document).ready(function(){
    setInterval(function(){
        $(".circle1").animate({top:"0", left:"0", width:"100px", height:"100px", opacity: 0}, 200);
        setTimeout(function(){
          $(".circle1").animate({top:"50px", left:"50px", width:"0", height:"0", opacity: 1}, 200);
        },250);
    },500);
});

顺便说一句，这是你的 fiddle http://jsfiddle.net/UxtJV/615/

祝一切顺利