Возможно использование как setTimeout, так и setInterval?

Question

Как я могу отложить выполнение анимации, состоящей из 30 последовательностей с интервалом 50 мс?

$(function() { 
    setInterval("anim1()", 50); 
    setTimeout("anim1()", 3000); /* doesn't work */ 
}); 



function anim1() { 
    var oCurBack = $('#fullback div.current'); 
    var oNxtBack = oCurBack.next(); 
    if (oNxtBack.length === 0) 
     return; 

    oNxtBack.addClass('current'); 
    oCurBack.removeClass('current').addClass('previous'); 
} 

Answer 1

Допущение: Вы хотите начать интервал анимации через 3 секунды

• поставить интервал в функцию задержке
• Я использую anim1 вместо "anim1()", поскольку использование строки является скрытой eval
• Вы, вероятно, хотите остановить анимацию, где вы сейчас вернетесь

---

var tId; // have global id to store the interval 
$(function() { 
    tId = setTimeout(function() { setInterval(anim1, 50) }, 3000); 
}) 

function anim1() { 
    var oCurBack = $('#fullback div.current'); 
    var oNxtBack = oCurBack.next(); 
    if (oNxtBack.length === 0) { 
    clearInterval(tId); // clear the interval now we are done 
    return; 
    } 
    oNxtBack.addClass('current'); 
    oCurBack.removeClass('current').addClass('previous'); 
} 

Повторить анимацию каждые 4 секунды попробовать

var tId1, tId2 
$(function() { 
    tId1 = setInterval(function() { 
    var $divs = $('#fullback div.current'); 
    $divs.removeClass(current); // remove all current 
    $divs.eq(0).removeClass('previous').addClass('current'); // add on the first 
    tId2 = setInterval(anim1, 50); 
    }, 3000); 
}); 


function anim1() { 
    var oCurBack = $('#fullback div.current'); 
    var oNxtBack = oCurBack.next(); 
    if (oNxtBack.length === 0) { 
    clearInterval(tId2); // clear the interval now we are done 
    return; 
    } 
    oNxtBack.addClass('current'); 
    oCurBack.removeClass('current').addClass('previous'); 
}