divがオブジェクトに覆われている問題を解決するにはどうすればよいですか?

零下一度
リリース: 2017-06-29 09:47:53
オリジナル
2560 人が閲覧しました

最近 Web プロジェクトに取り組んでいました。 というプラグインがあり、表示される
タグがそのプラグインによってカバーされます。 ボックスが表示されたら、それを覆い、iframe に
ダイアログ ボックスを配置します。これがこの問題の解決策です。私はついにこの問題を解決したので、参考のために私のアイデアを共有します。


(1) まず、オブジェクトタグを紹介します。W3school では、

定義と使用法

埋め込みオブジェクトを定義します。この要素を使用して、XHTML ページにマルチメディアを追加してください。この要素を使用すると、HTML ドキュメントに挿入されるオブジェクトのデータとパラメーター、およびデータの表示と操作に使用できるコードを指定できます。

タグは、画像、オーディオ、ビデオ、Java アプレット、ActiveX、PDF、Flash などのオブジェクトを含めるために使用されます。

object は元々、img 要素と applet 要素を置き換えることを目的としていました。ただし、バグとブラウザのサポート不足により、これは起こりませんでした。

ブラウザのオブジェクトサポートはオブジェクトタイプによって異なります。残念ながら、主要なブラウザはすべて、同じオブジェクト タイプをロードするために異なるコードを使用しています。

幸いなことに、object が解決策を提供します。 object 要素が表示されていない場合は、 の間のコードが実行されます。このようにして、複数のオブジェクト要素 (ブラウザごとに 1 つ) をネストできます。

一般に、オブジェクトタグはマルチメディアを埋め込むために使用されます。

(2) object タグのいくつかの重要な属性を簡単に紹介します:

classid - アプリケーションと、Windows システムで埋め込みコンテンツを実行するアプリケーションの一意の ID を関連付けます (この ID は変更できません。変更しない場合、プログラムは異常)、

たとえば、 clsid:D27CDB6E-AE6D-11cf-96B8-444553540000 -- Flash

data -- オブジェクトによって使用されるリソースの URL を指定します。

(3) IE のオブジェクト タグ カバレッジの問題

関連リソースをクエリした結果、IE の はウィンドウ要素、つまり、これらの要素は常に非ウィンドウの上にレンダリングされることがわかりました。唯一の解決策は、iframe を中間として使用することです。つまり、iframe を使用してオブジェクトをカバーし、次に div を使用して iframe をカバーします。

<div class="dropdown"><p>我是对话框</p><iframe id="iframe" src="about:blank" frameborder="0" marginheight="0" marginwidth="0" style="position:absolute;visibility:inherit; top:0px;left:0px;width:100%; height:100%;z-index:-1; filter:alpha(opacity=0);"></iframe> </div><div style="width: 950px;height: 400px;position: relative;z-index: 9;"><object id="CmCaptureOcx" style="width: 100%; height:100%;"classid="clsid:3CA842C5-9B56-4329-A7CA-35CA77C7128D">    </object></div>
ログイン後にコピー

注:

1. div は特定の z インデックスを持ち、iframe の z インデックスより大きくなければならず、auto または空にすることはできません

2. z は iframe の z インデックスより大きくなければなりません。 iframe の -index は負の値でなければなりません (以前は常に正の値に設定されていました。これは div の z-index より小さいですが、div でカバーできません)。そうしないと、div は iframe をカバーできません。 ;

3. iframe の上部と左は 0 であり、高さは div の幅と高さに等しいです。 iframe の透明度を 0 にします。

5. ページに複数のポップアップ ボックスがある場合は、js を使用して iframe を動的に追加できます。

以上がdivがオブジェクトに覆われている問題を解決するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート