Flash が HTML div 要素を覆わないようにする方法

今日、フラッシュ広告のコードを書いていたとき、フラッシュに付属するリンクはポップアップ広告と間違われやすいので、div レイヤーを作成してフラッシュの上に置き、リンクがによってトリガーされ、傍受されないようにしました。しかし、フラッシュは常に div レイヤー上にあることがわかりました。フラッシュにパラメータを追加する必要があることがわかりました。

フラッシュがフローティングレイヤーまたはドロップダウンメニューをブロックしないように DIV レイヤーの下にフラッシュを配置する方法と、フラッシュがフローティングオブジェクトまたはレイヤーをブロックしないようにするための重要なパラメーターは、wmode=opaque です。

方法は次のとおりです。

IEの場合は、<object></object>にパラメータ<param name="wmode" value="opaque" />を追加します。
FFの場合は、<embed />にパラメータwmode="opaque"を追加します。

123WORDPRESS.COM コード使用:

XML/HTML コードコンテンツをクリップボードにコピー

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html xmlns = "http://www.w3.org/1999/xhtml" >
<ヘッド>
<メタ http-equiv = "コンテンツタイプ" コンテンツ= "text/html; 文字セット = gb2312" />
<タイトル> 22cn </タイトル>
<スタイルタイプ= "text/css" >
<!--
体 {
位置:相対;
zインデックス:0;
マージン:0; パディング:0
}
本文、td、th {
色: #333333;
}
*{マージン:0; パディング:0}
画像{ 境界:0}
#jb51{ 位置:相対; 幅:300ピクセル; 高さ:250ピクセル}
#div1 {
位置:絶対;
左:0;
トップ:0;
幅:300ピクセル;
高さ:250px; zインデックス:-1
}
#div2 {
位置:絶対;
左:0;
トップ:0;
幅:300ピクセル;
高さ:250px;
zインデックス:99999;
}
-- >
</スタイル> </ヘッド>
<本文>
< div id = "jb51" >
< div id = "div1" >
<スクリプトタイプ= "text/javascript" >
document.write(' <オブジェクトクラスID = "clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" コードベース= "http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" 幅= "300" 高さ= "250" > ');
document.write(' <パラメータ名前= "映画" 値= "http://img.jb51.net/image/22cn_jb51net.swf" // ');
document.write(' <パラメータ名前= "品質" 値= "高" /> <パラメータ名前= "wmode" 値= "不透明" // ');
document.write(' <埋め込み src = "http://img.jb51.net/image/22cn_jb51net.swf" 品質= 「高」プラグインページ= "http://www.macromedia.com/go/getflashplayer" タイプ= "application/x-shockwave-flash" 幅= "300" 高さ= "250" wmode = "不透明" > </埋め込み> ');
document.write(' </オブジェクト> ');
</スクリプト>
</div>
< div id = "div2" >
< href = "http://i.am.cn/?s=jb51pic2" ターゲット= "_blank" > <画像 src = "http://img.jb51.net/image/touming.png" 幅= "300" 高さ= "250" /> </ a >
</div>
</div>
</本文>
</html>

標準フラッシュインサート

XML/HTML コードコンテンツをクリップボードにコピー

<!-- 標準の Flash 挿入
高さと幅を設定します。
幅= "400" 高さ= "400"
パスを設定します:
データ= "style/flash/001.swf" 、値= "style/flash/001.swf"
代替テキストまたは代替画像:
< href = "" タイトル= "" > <画像ソース= "" 代替= "" /> </ a >この部分は省略することもできます
-- >
<オブジェクトタイプ= "application/x-shockwave-flash" データ= "style/flash/001.swf" 幅= "400" 高さ= "400" >
<パラメータ名前= "映画" 値= "style/flash/001.swf" />
< href = "style/flash/001.swf" > <画像 src = "スタイル/img/001.jpg" alt = "フラッシュアニメーション" </a>
</オブジェクト>

レイヤーをカバーしないフラッシュ

XML/HTML コードコンテンツをクリップボードにコピー

<!-- レイヤーをカバーしないフラッシュ
Flash がフローティングオブジェクトまたはレイヤーをブロックするのを防ぐための主要なプロパティ:
<パラメータ名前= "wmode" 値= "不透明" />
<埋め込み wmode = "不透明" > </埋め込み>
-- >
<オブジェクトタイプ= "application/x-shockwave-flash" データ= "style/flash/001.swf" 幅= "400" 高さ= "400" >
<パラメータ名前= "映画" 値= "style/flash/001.swf" />
<パラメータ名前= "wmode" 値= "不透明" />
<埋め込み wmode = "不透明" > </埋め込み>
< href = "style/flash/001.swf" > <画像 src = "スタイル/img/001.jpg" alt = "フラッシュアニメーション" </a>
</オブジェクト>

透明なフラッシュ

XML/HTML コードコンテンツをクリップボードにコピー

<!-- 透明なフラッシュ
Flash を透明にするための主なプロパティ:
<パラメータ名前= "wmode" 値= "透明" >
-- >
<オブジェクトタイプ= "application/x-shockwave-flash" データ= "style/flash/001.swf" 幅= "400" 高さ= "400" >
<パラメータ名前= "映画" 値= "style/flash/001.swf" />
<パラメータ名前= "wmode" 値= "透明" >
< href = "style/flash/001.swf" > <画像 src = "スタイル/img/001.jpg" alt = "フラッシュアニメーション" </a>
</オブジェクト>

wmode プロパティ/パラメータ値ウィンドウ | 不透明 | 透明
テンプレート変数: $WM、(オプション) Internet Explorer 4.0 で透明な Flash コンテンツ、絶対配置、および階層化表示機能の使用を有効にします。このタグ/属性は、Flash Player ActiveX コントロールを備えた Windows でのみ有効です。

「ウィンドウ」は、Web ページ上の独自の長方形のウィンドウでアプリケーションを再生します。「ウィンドウ」は、この Flash アプリケーションが HTML レイヤーとやり取りせず、常に最前面に表示されることを示します。
「不透明」にすると、アプリケーションはページ上の背後にあるすべてのものを非表示にします。
「透明」にすると、HTML ページの背景がアプリケーションの透明な部分を通して表示され、アニメーションのパフォーマンスが低下する可能性があります。
「不透明ウィンドウレス」と「透明ウィンドウレス」はどちらも HTML レイヤーと相互作用し、SWF ファイルの上のレイヤーでアプリケーションを隠すことができます。 2 つのオプションの違いは、「透明」では透明が許可されるため、SWF ファイルの一部が透明な場合、SWF ファイルの下の HTML レイヤーがその部分を通して表示されますが、「不透明」では表示されません。

このプロパティを省略した場合、デフォルト値は Window になります。オブジェクトにのみ適用されます。

<<: ウェブページの右下隅に「いいね！」カード効果を実現するための CSS (サンプルコード)

>>: Vue3 を使用してポップアップコンポーネントをカプセル化するのは簡単ですか?