Fade in overlay in modal dialog

Question

I have a JQuery UI dialog which is modal and has a black background with 50% opacity. Is it possible to make the background opacity fade from 0% to 50%? If so, how? Because c

Answer 1

I know this is an old question, but I came across it just now in a search, and feel I could help other people.

This could be improved I'm sure but this will fade in and out your overlay when using a jQuery UI dialog.

open: function(){
    $('.ui-widget-overlay').hide().fadeIn();
},
beforeClose: function(){
    $('.ui-widget-overlay').remove();
    $("
", {
        'class':'ui-widget-overlay'
    }).css(
        {
            height: $("body").outerHeight(),
            width: $("body").outerWidth(),
            zIndex: 1001
        }
    ).appendTo("body").fadeOut(function(){
        $(this).remove();
    });
}