IFRAME 出现在 DIV 前面答案

【问题标题】：IFRAME appearing in front of DIVIFRAME 出现在 DIV 前面
【发布时间】：2013-12-09 15:53:19
【问题描述】：

我有一个 ASP.NET 站点，它有一个 Ajax 控件工具包动画扩展器来为飞出的 div 设置动画。 div 包含一个简单的树视图。

当用户在树视图中选择一个节点时，一个受保护的子被触发，它将页面上 IFRAME 的源设置为另一个 aspx 页面：

Protected Sub TreeView1_SelectedNodeChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles TreeView1.SelectedNodeChanged
    if1.Attributes.Add("src", "Open.aspx")
    if1.Style.Add("z-index", "-1")
    if1.Style.Add("position", "absolute")
End Sub

在 open.aspx 页面中，我只是将 PDF 文件读入字节流：

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    Response.Clear()
    Response.ContentType = "application/pdf"
    Dim xByteStream(1) As Byte
    Dim b = File.ReadAllBytes(Server.MapPath("reportFrameset.pdf"))
    Response.BinaryWrite(b)
    Response.End()
End Sub

我遇到的问题是在 iframe 加载 PDF 之前，div 出现在 iframe 的顶部，但是一旦 iframe 调用 open.asmx 并打开 pdf，div 就会出现在 iframe 的后面。

我尝试将两个组件（链接按钮 + 菜单 div 和 iframe）放在两个不同的 div 中，并将它们设置为位置：绝对或相对，并将 iframe div 的 z-index 设置为 -1，将链接设置为 999按钮 + 菜单 div 但这似乎并没有改变任何东西。

<div style="position:absolute; top:50px; left:20px; z-index:-1; width:400px; height:300px;">
  <iframe id="if1" name="if1" width="100%" height="50px" runat="server">
  </iframe> 
</div>

所以我想要的是将菜单显示在已加载 PDF 的 iframe 顶部。

如果有帮助，我已将网站项目的副本上传到 DropBox，它是 Visual Studio 2008 格式：https://www.dropbox.com/s/6vjl1m81m0e1ib9/WebApplication2.zip

【问题讨论】：

你试过z-index了吗？
你能提供一个小提琴

标签： jquery css pdf iframe

【解决方案1】：

发布问题后，我遇到了z-index does not work in Internet Explorer with pdf in iframe。

Jordan Gray 提供的解决方案适用于我的测试站点，但在我的实际站点中使用其他 CSS 和元素实现它时，它不起作用。我在这方面花了太多时间，所以选择了一个更简单的解决方案。

感谢桑花时间帮助我。

【讨论】：