jQuery UI: dialog show/hide effects with options

You can use this:

$("#dialog").dialog({
        autoOpen: false,
        hide: 'fold',
        show: 'blind'
});

And set two different effects to hide and show.

You can't use the "complete" method. At the least not with the actual release. That feature is planned for release 1.9

hope it helps


I don't know how to specify all the options, but I did manage to specify the speed, which is the option you have in your example. I did this as follows:

$('#dialog').dialog({
show: {effect: 'fade', duration: 250}
hide: {effect: 'fade', duration: 5000}
});

duration is the number of milliseconds that the animation will last. I found this out by stepping through the javascript with firebug.


To see the options of each effect you can go to http://docs.jquery.com/UI/Effects and click the Effect you wanna now the specifcs options. For exemple http://docs.jquery.com/UI/Effects/Bounce

Oh and by the way de Fade Effect doesn't have any specif arguments. If you use the Bounce Effect here's a code sample:

$( '#dialog' ).dialog({
show: {effect: 'bounce', duration: 350, /* SPECIF ARGUMENT */ times: 3}
});

Tags:

Jquery Ui