[全体] [技術メモ] 各一覧の該当ページへ

画像のマウスオーバー

[技術メモ] 2008年5月21日(水曜日) 21:49

メニューなどで、マウスが乗ると画像が反転したりする、アレのお話です。
(ソースを格好よく表示するプラグインが本末転倒になっておりますが…)

昔は、Javascriptで反転

メリット

  • とにかく、安定して動く
  • 印刷でも背景扱いにならない

デメリット

  • とにかく、HTMLソースが読み辛い
  • IEでツールチップ(ポコっとなるaltの代替テキスト)が出る

トップへ

昨今は、cssで反転

メリット

  • HTMLソースが読みやすい
  • 複数の画像を1つにまとめちゃったりもできる
  • ツールチップが出ない

デメリット

  • CSSソースが読み辛い。凝り具合によっては壊滅的
  • 印刷が背景扱いになる
トップへ

これから(既にか?)は、再びJavascript

メリット

  • HTMLソースはなかなか読みやすい
  • CSSソースもかなり読みやすい
  • 印刷で背景扱いにならない

デメリット

  • IEだとやっぱりツールチップが出る
  • 弱いPCだと重い場合も考えられる

トップへ

しばらくJSで行ってみます

hタグに画像が入ったり、ナビ上でツールチップが出ちゃうのが気に入りませんが、座標取りが楽で印刷対応も柔軟に行えますし、なによりcssがキレイなので、来月からはマウスオーバーはJSメインで組もうかな。現在作業中の案件も同様。

Comments (2)

2件のコメント