Question

嗨我试图用一个div覆盖一个pdf，使用adobe-reader插件为IE11渲染。这是描述我的问题的jsfiddle。由于某种原因，div位于嵌入式pdf的后面。有这个问题的解决方案吗？问题出现在IE11中。

pdf就像这样嵌入了它下面的div

<object id="pdf">
    <embed  src="http://www.education.gov.yk.ca/pdf/pdf-test.pdf"/>
</object>
<div id="overlay" />

这里是css：

#overlay {
    position: absolute;
    top: 0;
    left: 0;

    width: 100px;
    height: 100px;
    background-color: red;
    z-index: 1000;
}
#pdf {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}

感谢您的帮助。

更新！我设法使用iframe将div覆盖为pdf。但我不能让div透明。

<iframe style="position:absolute; left:0; top:0; width:150px; 
height:150px; background-color:blue; z-index:9;" src="http://www.education.gov.yk.ca/pdf/pdf-test.pdf"></iframe>

<div id="overlay" style="position:absolute; left:0; top:0; width:150px; 
height:150px; background-color:blue; z-index:10;"></div>

<iframe ALLOWTRANSPARENCY="true" style="position:absolute; left:0; top:0; width:50px; opacity: 0.0; 
height:150px; z-index:9;" 
srcdoc="<html><body style='background-color:transparent;'></body></html>"></iframe>

css保持不变。

一个新的小提琴可以是here

Adobe读者插件html透明叠加

0 个答案: