JQuery анимационная проблема цикла - PullRequest
Новая
       6

JQuery анимационная проблема цикла

0 голосов
/ 14 января 2011

Я пытаюсь выполнить анимационную функцию в цикле. Мне удалось выяснить одну итерацию этого, но я не могу понять, как повторить цикл определенное количество времени. Ниже моя функция анимации. Пожалуйста, помогите мне понять, как я могу выполнить это любое количество раз или даже сделать его бесконечным циклом. 

<script type="text/javascript">
$(document).ready(function(){
    var delay = 150;
    var times = 4;
    var i = 1;

    doMove = function() {
        if( i < times ){
            $('#lip').removeClass('lip'+i);
            $('#lip').addClass('lip'+(i+1));
        } else if ( i == times ) {
            $('#lip').removeClass('lip4');
            $('#lip').addClass('lip1');
        }

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

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


});
</script>

Большое спасибо. Я новичок в jquery.

1 Ответ

0 голосов
/ 14 января 2011

Задержка в вашем сценарии очень короткая, поэтому, возможно, вы не видите изменений.Попробуйте изменить 

var delay = 150;

на 

var delay = 1000; // 1 second

ОБНОВЛЕНИЕ

Ах - вы хотите, чтобы он снова запустился после завершения ... вотпример:

повторения = 0 будут бесконечными циклами, 1 будет выполняться один раз, 2 будет выполняться дважды и так далее ... 

var delay = 150;
var times = 4;
var repeats = 3;
var i = 1;
var j = 0;

doMove = function() {
    if( i < times ){
        $('#lip').removeClass('lip'+i);
        $('#lip').addClass('lip'+(i+1));
    } else if ( i == times ) {
        $('#lip').removeClass('lip4');
        $('#lip').addClass('lip1');
    }

    ++i;
    if( i >= times ) {
        if (j < repeats || repeats == 0) {
            i = 1;
        } else {
            clearInterval( interval ) ;
        }
    }
    ++j;
}

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