Frage

Ich möchte nach einer Verzögerung von ein paar Sekunden ein Element und alle seine Kinderelemente ausblenden. Ich habe jedoch keinen Weg gefunden, um festzustellen, dass ein Effekt nach einer bestimmten Zeitverzögerung beginnen sollte.

War es hilfreich?

Lösung

setTimeout(function() { $('#foo').fadeOut(); }, 5000);

Die 5000 sind fünf Sekunden in Millisekunden.

Andere Tipps

Ich benutze dieses Pause -Plugin, das ich gerade geschrieben habe

$.fn.pause = function(duration) {
    $(this).animate({ dummy: 1 }, duration);
    return this;
};

Nennen Sie es so:

$("#mainImage").pause(5000).fadeOut();

Hinweis: Sie benötigen keinen Rückruf.


Bearbeiten: Sie sollten jetzt die verwenden JQuery 1.4. eingebaute Verzögerung () Methode. Ich habe nicht überprüft, aber ich nehme an, es ist "kluger" als mein Plugin.

Früher würden Sie so etwas tun

$('#foo').animate({opacity: 1},1000).fadeOut('slow');

Das erste Animate tut nichts, da Sie bereits Opazität 1 im Element haben, aber es würde für die Zeit innehalten.

In JQuery 1.4 haben sie dies in das Framework aufgebaut, sodass Sie den Hack nicht wie oben verwenden müssen.

$('#foo').delay(1000).fadeOut('slow');

Die Funktionalität ist das gleiche wie das Original jQuery.delay() Plugin http://www.evanbot.com/article/jquery-delay-plugin/4

Der beste Weg ist die Verwendung der Jquery Delay -Methode:

$ ('#my_id'). Delay (2000) .Fadeout (2000);

Sie können es vermeiden, SetTimeout mit der Fadeto () -Methode () zu verwenden und eine Verzögerung von 5 Sekunden zu stellen.

$("#hideAfterFiveSeconds").click(function(){
  $(this).fadeTo(5000,1,function(){
    $(this).fadeOut("slow");
  });
});

Ich habe ein Plugin geschrieben, mit dem Sie eine Verzögerung in die Kette hinzufügen können.

Zum Beispiel $ ('#div'). fadeout (). Verzögerung (5000) .fadein (); // Element verblassen, 5 Sekunden warten, das Element zurück in das Element verblassen.

Es verwendet keine Animations -Hacks oder übermäßige Rückrufverkettung, nur einfacher, sauberer Kurzcode.

http://blindsignals.com/index.php/2009/07/jquery-delay/

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top