以下のサイトのトップページなのですが、マウスが画像にオーバーするとその画像がフェードアウトしてその下にあるGoogle Map をはめ込んだ画像が表示されるような作りになっています。
http://devanne.firedictionary.com/
元の画像とGoogle Map をはめ込んだ画像を同じ位置に表示したいのですが、IEでのみ4pxずれてしまいます。
画像を重ねるために、DOMの順番で上から Google Map をはめ込んだ画像(Tableを使ってレイアウトしています)、元の画像の順にレイアウトし、元の画像の方には、マイナスマージンを与えるという方法で重ねています。
Google Map をはめ込んだ画像のテーブル高さと同じだけ、マイナスマージンをCSSで指定しています。
フェードの操作でJavaScriptを使用していますが、JavaScriptで画像自体の位置を動かすような処理は全くしていません。
ネットでいろいろ調べてみたのですが、どうしても理由を見つけることができませんでした。
どなたか、CSSを使ったデザインに詳しい方、教えていただけたら大変助かります。
宜しくお願いします。
No.1
811
232
70pt
これで正解かどうか自信ありませんが、以下の方法では直りませんか？
<img id="home_image" src="images/island.jpg">
↑を↓に変更
<img id="home_image" src="images/island.jpg" style="display:block">
なお、余計なお世話とは思いますが、フェードさせるスクリプトはjQueryを使うならスクラッチで書く必要はないと思います。
No.1
811232
ここでベストアンサー
70pt
これで正解かどうか自信ありませんが、以下の方法では直りませんか？
<img id="home_image" src="images/island.jpg">
↑を↓に変更
<img id="home_image" src="images/island.jpg" style="display:block">
なお、余計なお世話とは思いますが、フェードさせるスクリプトはjQueryを使うならスクラッチで書く必要はないと思います。
すごい。完璧っす。（超感激！！）
ありがとうございます！！
フェードのスクリプトは、最初jQueryで、mouseover と mouseout のイベントで書いてみたのですが、マウスをテーブルの各セルを超えるときに、各セルがmouseoutをバブリングしてしまって上手く行かなかったのでスクラッチから書いてみることにしました。
重ねてお礼申し上げます。
feeds
2011/03/08 14:00:20
2
2
2
1
1
1
1
2
2
39
38
norisuke3
すごい。完璧っす。（超感激！！）
ありがとうございます！！
フェードのスクリプトは、最初jQueryで、mouseover と mouseout のイベントで書いてみたのですが、マウスをテーブルの各セルを超えるときに、各セルがmouseoutをバブリングしてしまって上手く行かなかったのでスクラッチから書いてみることにしました。
重ねてお礼申し上げます。