css - JQuery UI 限制覆盖 z-index

Question

我在 jQuery UI 中有一个对话框，它是一个模态对话框:

$("#mydialog").dialog({modal:true});

我有另一个 div，我想放在叠加层之上，但是，这个 div 是在对话框之前创建的，其他模式对话框也可能会显示。

我想要的基本上就像那个 div 的“始终在最前面”。

This jsfiddle解释得更好。

Answer 1

您需要将 position: relative 添加到您的 div，以便它脱离正常的页面流并尊重 z-index 属性，请参阅我的 updated fiddle

#mydiv {
    z-index: 1500;
    width: 100px;
    height: 100px;
    background:white;
    float:right;
    position:relative;
}

基本原理:z-index 属性只对定位元素有影响，所以你需要以下之一:

position: relative;
position: absolute;
position: fixed;