onmouseover="this.className=をjsファイルにまとめて、指定する場所はid=menu1,2～....かclass=menuで統一したい

質問

<div class="font1 bor1"
onmouseover="this.className=this.className+' bgcol txcol'"
onmouseout="this.className='font1 bor1'">
というものがあったとしてこれを
<div id="menu1・・・２・・・">だけにして
onmouseover=～をjsに略記できるようにしたいのですが
何かいい手はありませんか？

idで指定できる版のほかに
classで指定できる版があるとうれしいです。classだと難しいでしょうか？

また、こちらももしできればでいいのですが、this.classNameを
指定IDのclassName等もできるのでしょうか？

質問に不足があれば答えられる範囲で答えます。よろしくお願いします。

回答No.1

steel_gray · ベストアンサー

もうひとつ、質問内容を把握できてませんが、
jQueryを使ったサンプルを。中身は
「font1」ってclassを持つ要素のマウスオーバーで
bgcol と txcol の二つのクラスを追加する。
マウスアウトで
bgcol と txcol の二つのクラスを取り除く。
です。

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function(){

$('.font1').hover(function(){
$(this).addClass("bgcol");
$(this).addClass("txcol");
},function(){
$(this).removeClass("bgcol");
$(this).removeClass("txcol");
});

});
</script>

$('.font1')　という部分を　$('#font1') と書けば id="font1" の要素に対する設定になります。　

jQueryの解説、入手先等は
http://www.openspc2.org/JavaScript/Ajax/jQuery_study/index.html
とか、参考にしてください。

お礼

あ、これはなかなかいい感じに使えそうです、ありがとうございます。

他にもなんかいろいろできそうですねｂ