Question

我正在开发一个使用iframe的网络应用。我使用jQuery库编写了一个模态对话框函数，它在iframe中触发了一个模态弹出窗口。除了对话框背景外，一切都有效，当触发模态窗口时，只覆盖iframe内的部分。

这是预期的行为，我认为通过更改z-index值可以相对容易地修复，但我无法逃避iframe之外的模态背景。代码非常简单，我会在这里粘贴一下。

我应该指定我们的源代码树只能访问iframe，我们从父元素/控件继承，但不能访问它们，所以我只能使用iframe中的修复内容。

任何帮助或指示都将不胜感激。

<asp:Content ContentPlaceHolderID="CloudContent" runat="server">
<!--This triggers the modal dialog-->
<div class="cloudinfo"><a href="#dialog" name="modalbox">Add Cloud-Based Application</a></div>
</asp:Content>

Answer 1

经过不断的实验:-)，CSS改变就行了。将位置从“绝对”更改为“固定”解决了它。下面是一小段CSS，我希望这有助于其他人。

#modalBackground {
    z-index:1000; 
    position:fixed; 
    width:100%; 
    height:100%; 
    top:0; 
    left:0;
    background-color:#000;
    display:none;
}

jquery模态对话框背景不会超出iframe

1 个答案: