Javascript函數僅在Firefox上運行一次

Question

我具有以下javascript函數：

function kitemoving() {
    setInterval(function(){
        kite.animate({
            top: '+=30'
        },{ 
            duration: 1500 
        });
        kite.animate({
            top: '-=30'
        },{ 
            duration: 1500
        });
    });
}
kitemoving();

這是小提琴

僅在Mozilla Firefox上運行正常的所有地方，使用此代碼的所有動作都只能運行一次。 你能幫我理解為什么嗎？

Answer 1

不要使用間隔，您可以輕松地使fx隊列飽和。 相反，請使用任何完整的動畫回調，例如：

var kite = jQuery('.kite');

function kitemoving() {
    kite.animate({
        top: '+=30'
    }, {
        duration: 1500
    });
    kite.animate({
        top: '-=30'
    }, {
        duration: 1500
    }).promise().done(kitemoving);
}
kitemoving();

-jsFiddle-

Answer 2

您必須為delay參數指定一個值。

setInterval至少需要兩個參數。 從MDN報價

func是要重復調用的函數。

delay是setInterval（）函數在每次調用func之前應等待的毫秒數（千分之一秒）。 與setTimeout一樣，將強制執行最小延遲。

param1, param2,等是傳遞給func指定的函數的其他參數。

因此，當您省略第二個參數時，您將無法期望已定義的行為。

Answer 3

為了使您的小提琴在Firefox中工作，您要做的就是為setInterval調用提供間隔時間

setInterval(function(){
    ....
}, 3000);

這是一個更新的小提琴，可在Firefox中使用： http : //jsfiddle.net/wdodmvyu/5/

Answer 4

您沒有指定間隔值，這就是壁虎掙扎的原因。

function kitemoving() {
    setInterval(function(){
        kite.animate({
            top: '+=30'
        },{ 
            duration: 1500 
        });
        kite.animate({
            top: '-=30'
        },{ 
            duration: 1500
        });
    },300);//interval
}
kitemoving();