CSS z-index和移动的设备

yxyvkwin 于 2023-04-13 发布在其他

关注(0)|答案(1)|浏览(123)

我有一个jquery模态对话框，我想在模态对话框和屏幕之间放置一个完整的阴影，所以我用<div>创建了一个覆盖：

<div id="overlay" class="overlay btn-hidden"></div>
<div id="myDialogBox" name="myDialogBox" class="myDialogBox"></div>

在CSS中，我设置为：

.myDialogBox {
    z-index: 999 !important;
}

.overlay {
    z-index: 800 !important;
    position: fixed !important;
}

所以在桌面屏幕上，我认为覆盖正确地应用在对话框后面....但当我在Chrome上调试从桌面切换到移动的屏幕时，我看到覆盖在顶部，所以我不能对对话框采取行动....我还试图将position: relative用于覆盖，当我在移动上使用@media screen and (max-width: 769px)时，但在移动上覆盖甚至不出现...那么有没有一种方法可以强制覆盖层留在模态对话框的正后方，也在移动的屏幕上？....

css

来源：https://stackoverflow.com/questions/75969238/css-z-index-and-mobile-devices