我正在尝试使用jqueryUI库中的自动完成功能。我可以在正常页面上正常工作,但是当我在放大的弹出窗口中显示的表单中使用相同的功能时,它根本无法工作。

我在.ui-autocomplete jquery-ui.css上添加了z-index:9999

.ui-autocomplete {
    position: absolute;
    top: 0;
    left: 0;
    cursor: default;
    z-index: 9999;
}


大型弹出框的z索引为1043、1044、1045。

在Chrome浏览器中,我使用了Inspect Element并将对话框的不透明度更改为0.5,这样我就可以查看它是否在后面渲染,但事实并非如此。

有什么想法我可能还会错过吗?

谢谢

最佳答案

如果还有其他人需要答案,则需要在您的网页上添加以下代码,以在使用Magnific Popup的情况下覆盖jQuery-ui默认的CSS。

<style>
.ui-front
{
    z-index: 2000;
}
</style>


原因是因为jQuery-ui的.ui-frontz-index为100,而Magnific Popup的z-index则为1000+,因此如果使用默认值,则从技术上将在弹出窗口后面显示。

10-05 20:37
查看更多