プロが教えるわが家の防犯対策術!

JavaScript初心者です。
サムネイルに画像を合わせると、IDの付いた画像2枚とテキストの3箇所が同時に入れ替える、
というものを以下の方法で作成しました。

<script>
function swap(n) {
var items = [
{ Text:"テキスト1", ImageB:"b/sample1.jpg", ImageA:"a/sample1.jpg" },
{ Text:"テキスト2", ImageB:"b/sample2.jpg", ImageA:"a/sample2.jpg" },
{ Text:"テキスト3", ImageB:"b/sample3.jpg", ImageA:"a/sample3.jpg" },
];
var o = document.getElementById("photo");
document.getElementById("Txt").innerHTML = items[n].Text;
document.getElementById("PhotoB").src = items[n].ImageB;
document.getElementById("PhotoA").src = items[n].ImageA;
}
</script>

<div id="photo">
<img src="sample1.jpg" alt="" name="PhotoB" id="PhotoB">
<img src="sample2.jpg" alt="" name="PhotoA" id="PhotoA">
<div id="Txt" name="Txt">説明文1</div>
</div>

<a href="#" onmouseover="swap(0)"><img src="sample1.jpg" /></a>
<a href="#" onmouseover="swap(1)"><img src="sample2.jpg" /></a>
<a href="#" onmouseover="swap(2)"><img src="sample3.jpg" /></a>

このセットを同一ページで複数作成したいのですが、
IDを変えたセットを作ってもうまく動かず、困っております。

知識不足で申し訳ありませんが、この場合、どのような方法でしたら
複数の画像切り替えを作れるのでしょうか?

よろしくお願い致します。

A 回答 (1件)

回答がないみたいなので…



どのような内容が1セットで、2セット目とどこが変わるのか不明なので、考え方のみですが、
>IDを変えたセットを作ってもうまく動かず、困っております
データの内容や直接記述しているIDも含めて、スクリプトを別に作成すれば動作するはずです。

function名を同じにしていたり、呼び出す関数名を書き分けるのを忘れていたりしていませんか?
    • good
    • 0
この回答へのお礼

回答ありがとうございます!!!

上記のソースをまとめて1セット、画像・テキストのみ違う、もう1セットを作りたかったのです。分かりにくくて申し訳ありませんでした。

ご指摘の通り、function名を変更する等して解決することができました!

初心者のミスなのかもしれませんが、一人じゃとても行き詰まっていたので本当に感謝です。
ありがとうございました!!!!!!

お礼日時:2012/06/07 19:21

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!