阻止背景内容并专注于模态对话框

met*_*lah 12 jquery

我试图用我的两个jquery模式对话框阻止背景,直到用户关闭窗口.有关如何实现这一点的任何想法?

通过"阻止背景"我的意思是禁用页面上的其他元素(即使其他元素无法点击).

这是我的代码如下:

            // sign up dialog
        $( "#aboutus_dialog" ).dialog({
            autoOpen: false,
            show: "fadein",
            hide: "fadeout"
        });

        // sign up dialog
        $( "#signup_dialog" ).dialog({
            autoOpen: false,
            show: "fadein",
            hide: "fadeout"
        });     

        // about us modal
        $('#aboutus').click(function() { 
            modal: true,
            $("#aboutus_dialog").dialog("open");
            return false;
        });

        // about us modal
        $('#signup').click(function() { 
            $("#signup_dialog").dialog("open");
            return false;
        });
    });
Run Code Online (Sandbox Code Playgroud)

ant*_*ant 9

这就是你要找的东西

http://jqueryui.com/demos/dialog/#modal

它会阻止您拥有视图源按钮的背景.你有任何叠加吗?

尝试手动设置(不推荐,但通过css):

$(".ui-widget-overlay").attr('style','background-color: #000; opacity:1; z-index:1000;');
Run Code Online (Sandbox Code Playgroud)

当然,将模态选项设置为true.

如果颜色太强则相应地降低不透明度.