人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

質問をお願いします。
現在添付画像のような、サイトを制作しています。

下に並んでいるカラーのアイコンをクリックすると、上のハガキの画像と色コードのゴールドの文字が変わります。

多分eachを使うのかなというのはなんとなくわかるのですが、
今のソースだと、どちらかクリックすると、ファイル名と画像が両方変わってしまいます。

JSのソースが悪いのはわかるのですが、どこをどのように修正すると、個々に動かせるか、どなたがご教授頂けると嬉しいです。

よろしくお願いします。



$(function (){
//ファイル名を取得する
var cmArray = [];

for(i=0;i<$('.color-tab a').length;i++){
cmArray.push($('.color-tab a').eq(i).attr('title'))
}
$(".color-tab a").click(
function(){
var cmTxt = cmArray[$(".color-tab a").index(this)];
$(".file-name").text(cmTxt);
}
);

//カラーの上にマウスを乗せると白枠が付く
$('.color-tab img').hover(function(){
$(this).attr('src', $(this).attr('src').replace('_off', '_on'));
},function(){
$(this).attr('src', $(this).attr('src').replace('_on', '_off'));
});

//カラーをクリックすると画像が変わる
$(".color-tab a").click(function(){
$(".picture_area img").attr("src",$(this).attr("href"));
return false;
});
});

1374573142
●拡大する

●質問者: 匿名質問者
●カテゴリ:ウェブ制作
○ 状態 :キャンセル
└ 回答数 : 0/0件

回答がありません
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ