2012-04-16 10 views
7

Ich versuche, einen jQuery-Dialog ohne Schaltflächen zu öffnen, mit einigen Animationen anzuzeigen und dann automatisch für 3 Sekunden dort zu bleiben, und dann zu schließen. Hier ist ein jsfiddle von dem, was ich denke, sollte funktionieren, aber wie Sie es sehen können nur öffnet und schließt, ohne die 3 Sekunden waitng:jQuery-Dialog geöffnet und automatisch nach 3 Sekunden geschlossen

jsfiddle: http://jsfiddle.net/WrdM9/1/

Wer weiß, wie dies zu begradigen? Danke!

Antwort

16

sollten Sie setTimeout verwenden:

open: function(event, ui) { 
    setTimeout(function(){ 
     $('#dialog').dialog('close');     
    }, 3000); 
} 

Hier ist die Geige: http://jsfiddle.net/WrdM9/2/

+0

Ehrfürchtig, danke! –

2

Verwenden Sie die jQuery Verzögerungsfunktion z

$("#your-modal-id").slideDown(300).delay(800).slideUp(400); 
1

Wenn Sie auch einige Übergänge hinzufügen möchten, würde ich jQuery slideUp und slideDown Animationen nicht empfehlen. Diese sind langsam, da sie CPU statt GPU verwendet und die Animationen selbst fühlen sich nicht vollständig rechts.

Ich würde Velocity.js stattdessen empfehlen. Denken Sie daran, auch Velocity UI js hinzuzufügen. Und Sie könnten so etwas tun:

$("#your-modal-id").velocity('transition.slideUpBigOut', { delay: 3000 }) 
Verwandte Themen