Как выполнить функции в порядке очереди, в которых содержатся таймеры и анимации?

Необходимо перебрать в цикле массив функций и выполнить их так, чтобы каждая следующая начиналась после того как полностью завершатся таймеры и анимации предыдущей
К сожалению не смог разобраться с данной задачей
<button id="d1">111</button>
<button id="d2">222</button>
<button id="d3">333</button>
          
<script  type="text/javascript">

function d1() {
    $('#d1').slideUp(1000).slideDown(1000);
}   
         
function d2() {
    setTimeout(function(){
        $('#d2').hide(1000).show(1000);
    },2000);
}   
function d3() {
    $('#d3').fadeOut(1000).fadeIn(1000);
}  
  
var arf=[d1, d2, d3];  
    
for(var i = 0; i<arf.length; i++) {   
    // .....
}

</script>
  • Вопрос задан
  • 5076 просмотров
Пригласить эксперта
Ответы на вопрос 6
trushka
@trushka
может, так?
function d1(f) {
    $('#d1').slideUp(1000).slideDown(1000, f);
}   
         
function d2(f) {
    setTimeout(function(){
        $('#d2').hide(1000).show(1000, f);
    },2000);
}   
function d3(f) {
    $('#d3').fadeOut(1000).fadeIn(1000, f);
}  
  
var arf=[d1, d2, d3];  
    
for(var i = 0; i<arf.length; i++) { 
    arf[i](arf[i+1])
    // .....
}
Ответ написан
@lnked
можно так
function d1() {
    $('#d1').slideUp(1000).slideDown(1000);
    cb();
}
         
function d2() {
    setTimeout(function(){
        $('#d2').hide(1000).show(1000);
        cb();
    },2000);
}

function d3() {
    $('#d3').fadeOut(1000).fadeIn(1000);
    cb();
}

var fns = [ d1, d2, d3 ];

function cb()
{
    var fn = fns.shift();
    if( typeof fn == 'function' ) fn.call();
}

cb();
Ответ написан
Скорее Deferred.
И про него хорошо написано тут - anton.shevchuk.name/jquery-book (с 83-й страницы)
Ответ написан
не силен в js, но почему бы не вернуть функцией какое либо значение по выполнении, и далее через
switch (returnedValue) {
    //...
}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы