例として、三洋電機と三菱電機のサイトをあげます。
http://www.sanyo.co.jp/
http://www.mitsubishielectric.co.jp/index.html
これらのサイトは、メニューにボタン画像を使用しており
ロールオーバーの効果をもたせています。
そして、ボタン画像のすぐ下にページのメイン要素となるFlashが配置されています。
私もこのような構造のサイトを作っているのですが、
ひとつ解決できない問題があり悩んでいます。
私の作ったサイトでボタン画像にポインタを乗せるとロールオーバーするのですが、
ロールオーバー状態でポインタをFlashに移動させると
ボタン画像が通常の画像に戻らずロールオーバーのままなのです。
ポインタをFlashの領域から外すと通常のボタン画像に戻ります。
この現象は、Win IE以外のブラウザ（FirefoxやSafari）で起こります（Macではまだ検証していません）。
しかし、先述の三洋や三菱のサイトでは、
ボタン画像にポインタを乗せロールオーバー状態でポインタをFlashに移動させても、
ボタン画像が通常の画像に戻ります。
ちなみに、私のサイトでは、ボタン画像をJavaScriptの「rollover.js」を、
Flashは「SWFObject」を使って配置しています。
何か解決策をご存知の方いらっしゃいましたら
どうぞ宜しくお願いします。
投稿日時 - 2008-08-28 11:44:15
5人が「このQ&Aが役に立った」と投票しています
回答（1件中 1～1件目)
以前、ちょっと類似したご質問があったのでもしかしたら…と思ったのですが。
<div id="navi">
<ul>
<li><a href="#">ナビ1</a></li>
<li><a href="#">ナビ2</a></li>
<li><a href="#">ナビ3</a></li>
</ul>
</div>
<div id="flash">
（Flashに関する記述）
</div>
こんな感じの構造になっているでしょうか？もしかして、ナビの<a>の部分が一部閉じていなかったりはしませんか？
同様の構造のサンプルで試してみましたら、この場合、<a>の領域が正しく判断できなくなる為なのか、Firefoxなどのより文法にストリクトなブラウザではロールオーバーがONの状態になり放しになる様です。しかし、とかく何かと解釈の緩いIEではそのあたりを勝手に補正（迷惑な話です）してしまう様で、問題がない様に見えてしまいます。
既にHTMLの文法チェック済みで該当しない様でしたら忘れて下さい。
投稿日時 - 2008-08-28 15:29:32
お礼
ご回答ありがとうございます。
＞こんな感じの構造になっているでしょうか？
はい。以下のような感じです。
<div id="gnavi">
<ul>
<li><a href="1.html"><img src="abc.gif" class="imgover" /></a></li>
<li><a href="2.html"><img src="xyz.gif" class="imgover" /></a></li>
</ul>
</div>
<div id="flash">
Flash
</div><!-- / #flash -->
<script type="text/javascript">
// <![CDATA[
var so = new SWFObject("aiueo.swf", "xx", "800", "300", "9", "#fff");
so.addParam("menu", "false");
so.addParam("wmode", "window");
so.addVariable("flashVarText", "this is passed in via FlashVars for example only");
so.write("aiueo");
// ]]>
</script>
HTML自体は「Another HTML-lint gateway」でチェックをかけていて、
問題はありませんでしたので、<a>タグの抜けはありません。
このほか、私のサイトでは以下のXML宣言をしていますが、
<?xml version="1.0" encoding="shift_jis"?>
消してみても解決しませんでした。
文書型宣言は「XHTML 1.0 Transitional」です。
投稿日時 - 2008-08-28 16:47:56
