jquery 对话框与页面内容重叠

Question

我的帐户页面中有一个 jquery 对话框。当对话框出现时，它与页面内容重叠。请在此处查看图片。

http://s7.postimg.org/dxsg3u417/Capture.png。

对话框的代码是：

$('<div id="ratingloaderDiv"></div>').load("ratingDialog.jsp?id=" + id, function () {
    rateDialog = $(this).dialog({
        autoOpen: true,
        minHeight: 275,
        width: 400,
        height: 350,
        modal: true,
        open: function (event, ui) {
            var rating = 0;
            $('.rateCls' + id).rating({
                callback: function (value, link) {
                    rating = value;
                }
            });
            //more code goes.

谁能建议如何避免与页面内容重叠？

Answer 1

增加对话框z-index在其他内容z-index之上

例如：

body {
    z-index: 100;
}
.dialog {
    z-index: 101;
}

jquery 对话框与页面内容重叠

jquery dialog box overlapping with page contents

html

jquery

jquery-dialog