[CSS]Flashを背景にして動作する、階層型ナビゲーション
Post on:2008年3月1日
sponsors
CSS playのエントリー「A flyout menu over flash objects」から、Flashを背景にして動作する、階層型ナビゲーションの紹介です。
A flyout menu over flash objects
通常、Flashを背景とするとうまく動作しませんが、下記の手法を使用して実装しています。
swfの埋めこみの記述
「wmode」に、「transparent」を指定。
※swfファイルの背景色を確認する。
|
1 2 3 4 |
<textarea name="code" class="html" cols="60" rows="5"> <param name="wmode" value="transparent" /> <embed wmode="transparent"></embed> </textarea> |
IE6, 7用のスクリプト
objectがリンクのように動作するのを防ぐため、下記の「flashfix.js」を外部スクリプトとして使用する。
|
1 2 3 4 5 6 7 8 |
<textarea name="code" class="html" cols="60" rows="5"> onload = function(){ theObjects = document.getElementsByTagName("object"); for (var i = 0; i < theObjects.length; i++){ theObjects[i].outerHTML = theObjects[i].outerHTML; } } </textarea> |
階層型ナビゲーションの箇所は、スクリプトがオフでも動作するように、IE6用にtableを使用して制作されています。
追記：
- 2008年3月1日
- はてブのvv_boow_vvさんのコメントから
- 僕のMac OS X+Fx 2.0の環境でも動作しませんでした。
階層は開くけど、クリックができない。
sponsors
