Question

I m 试图通过将图像的背景定位在 lo中形成装饰:

$( #LoginButton ).click(function () {

    var i = 1, h = 0, top;

    for (i = 0; i <= 12; i++) {
        h = i * 40;
        top = h +  px ;
        $( #ajaxLoading ).css( background-position ,  0 -  + top).delay(800);
    }

});

The problem here is that it runs to fast so I don t se the animation of the moving background. So I added jquerys delay(), but:

延误(800)没有奏效,因为延迟()只进行 j蒸效应,cs()不是其中之一。

如何拖延这一 lo?

Answer 1

我建议使用j Query时r plugin:

$( #LoginButton ).click(function () {
    var times = 13;
    var delay = 300;
    var h = 0, top;
    $(document).everyTime(delay, function(i) {
        top = h +  px ;
        $( #ajaxLoading ).css( background-position ,  0 -  + top);
        h += 40;
    }, times);
});

如果你不想要任何假想,则使用套 Interva/clear 间歇:

$( #LoginButton ).click(function () {
    var delay = 300;
    var times = 13;
    var i = 0, h = 0, top;

    doMove = function() {
        top = h +  px ;
        $( #ajaxLoading ).css( background-position ,  0 -  + top);
        h += 40;

        ++i;
        if( i >= times ) {
            clearInterval( interval ) ;
        }
    }

    var interval = setInterval ( "doMove()", delay );
});

Answer 2

您是否考虑使用囚犯而不是 c子? 我确信,我知道你想要完成的工作,因此,这是黑暗的枪声。

rel=“nofollow”>http://api.jquery.com/animate/

Answer 3

Chrome, Safari and IE3+ should support background-position-y, so if you re targeting these specific browser, using jquery you could just make a timed animation() on backgroundPositionY property - http://snook.ca/archives/html_and_css/background-position-x-y (On Firefox the effect won t work)

Answer 4

为了做到这一点,你可以使用定时和明确的时间。

IE:

var GLOBAL_i = 0;

function doAnimation() {

    var h = GLOBAL_i * 40;
    var top = h +  px ;
    $( #ajaxLoading ).css( background-position ,  0 -  + top);

    if (GLOBAL_i < 12) {
        GLOBAL_i++;

        t=setTimeout(doAnimation, 800);
    }
}

$( #LoginButton ).click(function () {

    doAnimation()

});

友情链接