ritardare gli effetti JQuery
-
05-07-2019 - |
Domanda
Voglio sbiadire un elemento e tutti i suoi elementi figlio dopo un ritardo di alcuni secondi. ma non ho trovato un modo per specificare che un effetto dovrebbe iniziare dopo un determinato ritardo.
Soluzione
setTimeout(function() { $('#foo').fadeOut(); }, 5000);
Il 5000 è di cinque secondi in millisecondi.
Altri suggerimenti
Uso questo plug-in di pausa che ho appena scritto
$.fn.pause = function(duration) {
$(this).animate({ dummy: 1 }, duration);
return this;
};
Chiamalo così:
$("#mainImage").pause(5000).fadeOut();
Nota: non è necessario un callback.
Modifica: ora dovresti utilizzare jQuery 1.4. costruito nel metodo delay () . Non ho controllato ma presumo sia più "intelligente" del mio plugin.
Prima facevi qualcosa del genere
$('#foo').animate({opacity: 1},1000).fadeOut('slow');
Il primo animato non sta facendo nulla poiché hai già l'opacità 1 sull'elemento, ma si fermerebbe per la quantità di tempo.
In jQuery 1.4, hanno incorporato questo nel framework in modo da non dover usare l'hack come sopra.
$('#foo').delay(1000).fadeOut('slow');
La funzionalità è la stessa del plug-in jQuery.delay ()
originale http://www.evanbot.com/article/jquery-delay-plugin/4
Il modo migliore è utilizzare il metodo di ritardo jQuery:
$ ( '# my_id') ritardo (2000) .fadeOut (2000);.
Puoi evitare di usare setTimeout usando il metodo fadeTo () e impostando un ritardo di 5 secondi su questo.
$("#hideAfterFiveSeconds").click(function(){
$(this).fadeTo(5000,1,function(){
$(this).fadeOut("slow");
});
});
Ho scritto un plugin per permetterti di aggiungere un ritardo nella catena.
ad esempio $ ('# div'). fadeOut (). delay (5000) .fadeIn (); // dissolvenza dell'elemento, attendere 5 secondi, dissolvenza dell'elemento.
Non utilizza hack di animazione o concatenamento eccessivo di callback, solo un semplice codice breve pulito.