html - iframe 上の div 回避策が Chrome で機能しない

Question

iframe の pdf の上に表示したいメニュー div があります。私が見つけた回避策は、空の iframe を div の後ろに配置することです。Firefox/IE では正常に動作します。Chrome には、iframe の背後にまだメニュー div があります。ああ、Adobe PDF プラグインを有効にしました。誰でもこれを経験したことがありますか？

フィドルを見る

Answer 1

iframe としてではなく (wmode を使用して) オブジェクトとして追加すると、Chrome で正常に動作するように見えます (参考までに、私のバージョンの Chrome: Windows 7、Chrome 16 では正しく動作していないことを確認できます)。これを試して：

<div id="objectContainer">
    <object id="pdfObject"  data="http://mirror.hmc.edu/ctan/macros/latex/contrib/pdfpages/dummy.pdf" type="application/pdf" width="600" height="500" style="z-index:1" wmode="opaque">
  alt : <a href="test.pdf">test.pdf</a>
</object>
</div>
<iframe id="emptyIframe" src="about:blank" frameborder="0">something</iframe>
<div id="menu">
    Menu
</div>

これは Firefox でも機能します。ただし、IE で問題が発生する可能性があります。サーバー側のブラウザー検出を行い、ブラウザーに応じて埋め込みオブジェクトまたは iframe のいずれかを出力することをお勧めします。