jQuery efektleri, aynı anda değil, sırayla nasıl çalışır?

Question

jQuery'de aynı anda değil iki sırada nasıl iki efektim olabilir? örneğin Bu kod parçasını ele alalım:

$("#show-projects").click(function() { 
    $(".page:visible").fadeOut("normal"); 
    $("#projects").fadeIn("normal"); 
}); 

fadeOut ve fadeIn aynı anda çalışabilir, nasıl onları birbiri ardına yapabilirim?

Answer 1

Sen etkisi tamamlandıktan sonra çalıştırmak etkileri işlevlerine bir geri arama sağlayabilmektedir.

$("#show-projects").click(function() { 
    $(".page:visible").fadeOut("normal", function() { 
     $("#projects").fadeIn("normal"); 
    }); 
}); 

Answer 2

Ne istiyorsunuz, sıra. Bazı çalışma örnekleri için başvuru sayfasına http://api.jquery.com/queue/ üzerinden

kontrol edin.

Answer 3

Hedef olmak zorunda mı? Tabii ki, hedef sabit olduğu sürece sırayla sıralı olarak sıraya girmek için rastgele bir hedef kullanabilirsiniz ... altta, sıradaki bir animasyon hedefinin ebeveyini kullanıyorum.

//example of adding sequential effects through 
//event handlers and a jquery event trigger 
jQuery(document).unbind("bk_prompt_collapse.slide_up"); 
jQuery(document).bind("bk_prompt_collapse.slide_up" , function(e, j_obj) { 
    jQuery(j_obj).queue(function() { 
     //running our timed effect 
     jQuery(this).find('div').slideUp(400); 
     //adding a fill delay to the parent 
     jQuery(this).delay(400).dequeue(); 
    }); 
});      
//the last action removes the content from the dom 
//if its in the queue then it will fire sequentially 
jQuery(document).unbind("bk_prompt_collapse.last_action"); 
jQuery(document).bind("bk_prompt_collapse.last_action" , function(e, j_obj) { 
    jQuery(j_obj).queue(function() { 
     //Hot dog!! 
     jQuery(this).remove().dequeue(); 
    }); 
}); 
jQuery("tr.bk_removing_cart_row").trigger( 
    "bk_prompt_collapse" , 
    jQuery("tr.bk_removing_cart_row") 
); 

değil onun mümkünse emin ama sen .dequeue bağlamak olabilir gibi görünüyor() ateş zaman, bunun yerine yukarıda benim örnekte satır içi ateş başka jquery olay yangınlar? bir animasyon kuyruğunu etkin bir şekilde durdurma

Answer 4

$("#foo").fadeOut(300).delay(800).fadeIn(400);