Question

我想在每30秒后做一次div反弹3次，这将是一个购物车结账提醒，固定位于屏幕右侧，它应该反弹三次，然后停止30秒，然后又反弹了3次......很快。目前我使用的是animate类，因为当我有固定位置时我没有弹跳工作......或者我认为这是问题所在。无论如何，这是代码。：

目前它只是继续弹跳，它在3秒后停止播放，以及如何让它在30秒后再次开始弹跳？

var baloon = $('.checkout');
function runIt() {
    var intID = setInterval(function() {
    baloon.animate({width:'+=4'}, 500);
    baloon.animate({width:'-=4'}, 500);
    }, 1000);
}

runIt();




<div class="checkout"> 
 <img src="img/checkout.png" alt="checkout"> 
 </div>


.checkout{
    width:26px;
    height:114px;
    top:50%;
    right:0px;
    float:right;
    position:fixed;
    z-index:10;


}

Answer 1

你可能期待这个

var baloon = $('.checkout');
function runIt() {
    var intID = setInterval(function() {
        for (var i = 0; i <= 3; i++){
            baloon.animate({width:'+=4'}, 500);
            baloon.animate({width:'-=4'}, 500);
        }
    }, 30000);
}

runIt();

Jquery在3秒后停止动画并在30秒后再次运行

1 个答案: