4

jQuery UIモーダルダイアログボックスのオーバーレイにフェードアウト効果を適用することは可能ですか? 問題は、モーダル ダイアログ ボックスを閉じたときにオーバーレイ div が破棄され、あらゆる種類のアニメーションが妨げられることです。これは、閉じるときにオーバーレイ div が破棄されなかった場合に機能するコードです。

$("#edit-dialog-box").dialog(
{
    autoOpen: false,
    modal: true,
    width: "30em",
    show: "fade",
    hide: "fade",
    open: function()
    {
        $(".ui-widget-overlay").hide().fadeIn();
    },
    close: function()
    {
        $(".ui-widget-overlay").fadeOut();
    }
});
4

2 に答える 2

7

デモ: http://jsfiddle.net/276Ft/2/

$('#dialog').dialog({
    autoOpen: true,
    modal: true,

    width: '100px',
    height: '100px',

    show: 'fade',
    hide: 'fade',

    open: function () {
        $('.ui-widget-overlay', this).hide().fadeIn();

        $('.ui-icon-closethick').bind('click.close', function () {
            $('.ui-widget-overlay').fadeOut(function () {
              $('.ui-icon-closethick').unbind('click.close');
              $('.ui-icon-closethick').trigger('click');
            });

            return false;
        });
    }
});

</p>

于 2012-08-31T03:04:47.180 に答える