JavaScriptでの画像切り替えを複数セット

質問

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

<script>
function swap(n) {
var items = [
{ Text:"テキスト１", ImageB:"b/sample1.jpg", ImageA:"a/sample1.jpg" },
{ Text:"テキスト２", ImageB:"b/sample2.jpg", ImageA:"a/sample2.jpg" },
{ Text:"テキスト３", 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">説明文１</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を変えたセットを作ってもうまく動かず、困っております。

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

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

回答No.1

fujillin · ベストアンサー

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

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

function名を同じにしていたり、呼び出す関数名を書き分けるのを忘れていたりしていませんか？

お礼

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

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

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

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