当前位置: 首页 > Web前端 > HTML

z-index在InternetExplorer中无法在iframe中使用pdf

时间:2023-04-02 17:10:30 HTML

我知道有一种技术可以可靠地遮挡IE中的窗口控件和其他元素,但您不会喜欢它。背景:有窗口和无窗口元素IE将元素分为两种类型:有窗口和无窗口。div和input等常规元素是无窗口的,由MSHTML引擎直接呈现。然而,带窗口的元素在单独的MSHTML平面中呈现,并绘制在任何侵入为它们保留的空间的元素上。他们尊重彼此的z-index,但总是在无窗口元素之上绘制。此规则的唯一例外是iframe。在IE5中,iframe是一个窗口元素。这在IE5.5中已更改;它现在是一个无窗口元素,但出于向后兼容性的原因,它仍将绘制具有较低z-index的窗口元素。至关重要的是,它还尊重无窗口元素的z-index——因此,如果您将iframe放置在有窗口元素上,那么您放置在ifr上的任何无窗口元素ame将可见。这意味着什么本质上,PDF绘制在常规页面内容之上-就像IE7之前的选择元素一样。最简单的解决方法是在您的内容和PDF.DemojsFiddle之间使用另一个iframe:http://jsfiddle.net/Jordan/gDuCECodeHTML:我的文本应该在顶部

CSS:#outer{位置:相对;左:150px;顶部:20px;宽度:100px;z-index:2;}#inner{背景:红色;}.cover{边框:无;位置:绝对;顶部:0;左:0;高度:100%;宽度:100%;z-指数:-1;}#pdf{位置:相对;z-index:1;}Support这已经过测试并且应该在IE7-9中工作。如果你对它在其他浏览器的DOM中显示感到挑剔,您可以使用JavaScript添加它或将其包装在仅限IE的条件注释中: