twitter-bootstrap - Bootstrap 修复菜单 + jquery 对话框问题

Question

当我在小窗口中显示 JQuery 对话框时，它位于页面顶部，菜单关闭对话框。

$(function () {
    $('.d').dialog({
                width: '75%',
                height: 600,
                modal: true,
                draggable: false,
                resizable: false,
        position: [ "center", 100]
    });
});

见：http ://snag.gy/BSJVs.jpg

示例：http: //jsfiddle.net/ishubin/9ruhx/1/

我该如何解决（例如设置 margin-top: 100px）？

Answer 1

你有两种简单的方法来处理这个问题。

更干净的解决方案：确保如果显示对话框，它始终位于菜单顶部：

// add this to your css file

div.ui-dialog {
     z-index: 1031 !important;   
}

可以在http://jsfiddle.net/9ruhx/2/上找到一个工作示例。

否则，您可以确保对话框始终在顶部菜单下方打开：

// your css file

div.ui-dialog {
     top: 45px !important;
}

见http://jsfiddle.net/9ruhx/3/。