画像で作成したボタンの処理について

HTML、CSS、Javascriptを勉強中の初心者です。
あまり難しいことはわからないので、噛み砕いて説明してくださるとうれしいです。

あるWebページで、画像で作成したボタンA、B、Cを一列に配置されている状態で、以下のような処理をしたいと思っています。
(1)画像Aがクリックされたら、画像Aを画像A2に置き換える
(2)画像A2が表示されている状態で、画像Bをクリックすると、画像A2は画像Aとなり、画像Bは画像B2となる

質問内容は以下です。
(1)の処理をonclick処理で実装したところ、クリックした瞬間のみ画像A2となり、カーソルが離れると画像Aに戻ってしまうが、クリックした状態のままにするには他にどのような処理が必要なのか。
(2)jQuery？でif文でできるような気がするが、サンプルとなるものがなく、書き方がわからない…。

上記について、ご回答よろしくお願いします。

No.2 回答者： nana_coco 回答日時： 2014/03/08 21:43

こんばんは。

↓この辺が参考になるかと思います。

http://codingmania.net/globalnav/432.html

http://codingmania.net/globalnav/409.html

この回答へのお礼

ありがとうございます。
既存のソースの修正なのですが、元々のソースがテーブルで作成した枠の中に画像を配置しており、リスト化されていないものだったのですが、リスト化してこちらを参考にやってみたいと思います。

なるべくソースを変えないでと言われていますが、どれだけ調べてもリスト化するしか方法がなさそうですものね…。

お礼日時：2014/03/09 19:35

No.1 回答者： nanden1548 回答日時： 2014/03/08 11:24

意味がよくわからない！

ボタンをクリックする＝リンク先に飛ぶ
onclickでボタン背景を変える意味がないのでは？・・・
onMouseで背景を変える＝ロールーオーバー

どうしてもやりたいのであれば、作れるが意味がないのでは？・・・
ユーザビリティとか、ウェブの意味をもっと理解する必要があると、おもわれるが？・・・

レイヤー(z-index)を重ね、同じ位置に、透明度をゼロにの画像を表示すれば、CSSだけで十分できるとおもうが？・・・
考え方だけ・・・スクリプトを使うとブラウザのスクリプトを切っている人には、まったく変化がない！

この回答への補足

意図が伝わらずすみません。

ロールオーバー、クリックでそれぞれ別のボタン画像を入れ替えるというのはユーザー側の希望です。
私が趣味で作っているものではあれば自由に変えることもできますが、そうもいかないので困っているのです。

補足日時：2014/03/09 19:29