アプリ版:「スタンプのみでお礼する」機能のリリースについて

現在ソート機能を持ったサイトを制作しており、そのソート機能を持ったボタンを画像で作成しております。そのため画像をクリックすると別の画像(いわばマウスオーバー時のような画像)としたいので、何時間か探りましたが理解できるものがこのJsしかありませんでした。この状態でもよいのですが、ほかにも複数のソートボタンがあるので複数の管理がしやすいものをご存知・提案が出来る方がいらっしゃれば回答お願いします。

この手のコーディングについて初心者で、手探りの状態です。
何卒ご助力頂けると幸いです。

<SCRIPT LANGUAGE="JavaScript">
img = new Array("image/we_syu_h.png","image/we_syu.png");
i=0;
function myChange(){
i++;
i %=img.length;
document.we_syu.src = img[i];
}
// -->
</SCRIPT>
<a href="JavaScript:myChange()"><img id="we_syu" src="image/we_syu.png" border="0" name="we_syu"></a>

質問者からの補足コメント

  • このままでもと書いてしまいましたが、このままでは他のボタンにも同じ効果を付与できないのでご助力お願いいたします。

      補足日時:2016/01/18 17:01
  • もう一度押すともとに戻るという考えで間違いないです。

    複数あるというのはボタンごとに違う画像をそれぞれ二つ(通常の画像+クリック後の画像)が別個に存在しているということです。わかりにくくて申し訳ありません…!

    No.1の回答に寄せられた補足コメントです。 補足日時:2016/01/18 17:19

A 回答 (2件)

画像がボタンごとに違うとなると、データ管理がちょっと面倒ですね



本来の使い方と少し違いますが、lowsrcを使う手はあります。
こんな感じ

<script>
function myChange(obj){
var src=obj.lowsrc;
obj.lowsrc=obj.src;
obj.src=src;
}
</script>
<img src="1.jpg" lowsrc="2.jpg" onclick="myChange(this)">
<img src="3.jpg" lowsrc="4.jpg" onclick="myChange(this)">
    • good
    • 0
この回答へのお礼

すべて反映されました!本当にありがとうございました!

Js勉強中の身ですのでよろしければこのscriptはどのように構成されているかの説明も頂けると助かります。お願いばかりで申し訳ありませんがよろしければお願いいたします。

お礼日時:2016/01/18 17:45

仕様確認



画像(ボタン)をおすと別の画像に切り替わりもう一度おすと元にもどるでOK?
複数あるというのはおなじ画像を利用する?ボタンごとに違う画像?
この回答への補足あり
    • good
    • 0

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