オンマウスで画像ロールオーバー+テキスト変更
こんにちは、javascript初心者です。
現在、Dreamweaver CS4でサイトを作っています。
以下のような構成になっており、menuの画像をオンマウスすると、ロールオーバーして画像の色が変わるようにしています。
(javascriptはDreamweaverが自動生成しています)
▼ココカラ ------------------------------------------
<head>
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body>
<div id="menu">
<a href="a.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('menua','','a2.jpg',1)"><img src="a.jpg" alt="a" name="menua"></a>
<a href="b.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('menub','','b2.jpg',1)"><img src="b.jpg" alt="b" name="menub"></a>
<a href="c.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('menuc','','c2.jpg',1)"><img src="c.jpg" alt="c" name="menuc"></a>
<a href="e.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('menud','','d2.jpg',1)"><img src="d.jpg" alt="d" name="menud"></a>
</div>
<div id="submenu">挨拶文</div>
<div id="main"></div>
<div id="footer"></div>
</body>
</html>
▲ココマデ ------------------------------------------
このメニューのオンマウスですが、ロールオーバーの動作は残したまま、submenu部分の挨拶文を各ページのサブメニューに差し変えることは可能でしょうか?
(aのメニューをオンマウスすると画像の色が変わり、aのサブメニューがsubmenuに表示される等)
同じような事例を見つけたのですが、
http://okwave.jp/qa/q4651643.html
こちらは画像が1箇所だったので、初心者の私では応用の仕方が分かりませんでした。
現在のjavascriptに追加する形でもまったく違うものでも良いですので、ご教授いただけると助かります。
よろしくお願いいたします。
補足
ご回答ありがとうございます。 確かに…テンプレート機能でメニューを作っているんですが、ロールオーバー画像を追加しました。でも、テンプレート上のソースにはJavascriptは記載されていません。(更新しても記載されていませんでした。)javascriptファイルは外部ファイルとして使用しています。その外部ファイルに自分で追加しないから、各ファイルに書きこまれてしまうのでしょうか?! 説明が下手で分かりにくかったらごめんなさい。私がやった作業を詳しく書かせてもらいます。 テンプレートで作成しているメニュー部はロールオーバーを使用しています。いくつか追加したいメニュー項目がありロールオーバー画像を付け加えました。で、全部のファイルを更新する を選択したら、全部のhtmlファイルに書き出されてしまいました。 この問題が解決できれば本当に助かります…また教えていただければ幸いです。よろしくお願いします。