Webデザインコミュのa:hoverについて質問

マウスが乗っかったときに背景の色を変えようと思うのですが、皆さんはどのように作りますか？
よく企業とかのHPであるメニューバーです。

いろんなサイトを見るとjavascriptで組んでいますが、自分はjavascriptが不勉強で・・・
cssのa:hoverで設定をやっている本を見つけ実行・・・

確かに自分のイメージしている通りの結果になったのですが、どっちがいいんでしょうかね？

皆さんならjavascriptとcssのどっちで作りますか？

ちなみに私が書いたソースは以下の通りです。

/*タイトルメニューの設定*/
#titlemenu ul,#titlemenu li
{
margin:0;
padding:0;
list-style:none;
}
#titlemenu li
{
float:left;
text-align:center;
border-right:1px solid #000000;
border-top:1px solid #000000;
border-bottom:1px solid #000000;
width:132px;
}
#titlemenu a,#titlemenu a:link,#titlemenu visited
{
text-decoration:none;
color:black;
background-image:url("sozai/button.JPG");
padding:3px 10px;
display:block;
}
#titlemenu a:hover
{
color:red;
background-image:url("sozai/mousu_over.JPG");
}

ご意見よろしくお願いします。

コメント(9)

最初
全て
最新の40件

[1] mixiユーザー 08月07日 19:00

CSSで画像を入れ替える方法は、あまりおすすめしません。
hoverの時に画像をずらしたほうがベターでしょう。

[4] mixiユーザー 08月07日 19:25

>> 2: 百太郎さん
プリロードしておかないと最初のポイント時にちらつきます。

[5] mixiユーザー 08月07日 19:49

http://www.stylish-style.com/csstec/basic/l-rollover5.html

hoverの時に画像をずらす方法。たとえばコレですね。
この方法だとプリロードが不要なのでオススメ。

[7] mixiユーザー 08月07日 21:50

＞ウッスーさん
なるほど、ずらすという発想があったのか・・・
参考になります。

＞kt = fluiさん
ごめんなさい、指摘されて気付きました。
訂正します→mouse

＞やまさん
参考サイトありがとうございます。
ダウンメニューもcssで設定できるんですね。
このサイトは知りませんでした、教えていただきありがとうございます。

javascript派の意見も欲しいな・・・

ログインすると、みんなのコメントがもっと見れるよ