こんにちは、javascriptにてボタンを押すと画像が透明度が下がる

質問

こんにちは、javascriptにてボタンを押すと画像が透明度が下がる動きを作っています。
ボタンを押すとフェードアウトはできるのですが、フェードアウトした画像を
元の透明度にフェードインすることが出来ません。
if文のclassに書かれている変数の扱いがよくわからないので、質問させて頂きました。

forで回してカウントから取得してみようかと,すべての画像に<p class＝"fade1">のような
タグをすべての画像に付けて、javascript記述できればと思っていましたが、classの指定が
$(".fade+i img")等と指定してみましたが、動きませんでした。
適切な方法がありましたら、教えてください。よろしくお願いします。

【html】
<div class="thumbnail">
<img src="g_images/IMG_1470.jpg" alt="画像1" class="item-image" hspace="5" vspace="3" />
<img src="g_images/DSC02564.JPG" alt="画像2" class="item-image" hspace="5" vspace="3" />
<img src="g_images/DSC02227.JPG" alt="画像3" class="item-image" hspace="5" vspace="3" />
<img src="g_images/DSC02555.JPG" alt="画像4" class="item-image" hspace="5" vspace="3" />
<img src="g_images/DSC02558.JPG" alt="画像5" class="item-image" hspace="5" vspace="3" />
</div>

【javascript】
$(document).ready(
function(){
$(".thumbnail img").click(function(){
if($(".thumbnail img").css("opacity")!=1.0){
$(".thumbnail img").fadeTo("normal", 1.0); // マウスオーバーで透明度を60%にする
}
$(this).fadeTo("normal", 0.4); // マウスオーバーで透明度を60%にする
});
});

回答No.2

steel_gray · ベストアンサー

#1です。
多少(?)無駄はあるけどより単純な方法で。

<script type="text/javascript">
$(function(){
$(".thumbnail img").click(function(){
$(".thumbnail img").each(function(){
if($(this).css("opacity")!=1.0)
$(this).fadeTo("normal", 1.0);
});
$(this).fadeTo("normal", 0.4);
});
});
</script>

お礼

おお、動きました！ありがとうございます！javascriptの記述はまだ不慣れなものでして
助かりました。ちなみに、eachってちょっと調べてみましたが、each(.thumbnail内のにあるすべてのimgを対象)として繰り返しif文でフェードの状態を確認しているのですね。
普段perlをよく書いているので、書き方が大分違うことがわかり非常に参考になりました。
ありがとうございました！

回答No.1

steel_gray

ボタンが見当たらないんだけど・・・画像をクリックするたびに透明＜＞半透明を切り替えるって事でいいのかな？

<script type="text/javascript">
$(function(){
$(".thumbnail img").click(function(){
if($(this).css("opacity")!=1.0){//opacityが1.0じゃなければ
$(this).fadeTo("normal", 1.0);//opacityを1.0に戻す
} else {
$(this).fadeTo("normal", 0.4);//opacityを0.4にする
}
});
});
</script>

補足

回答ありがとうございます。
はい、steel_grayさんのおっしゃるとおり、ボタンではなく、画像でした。
表現悪く失礼しました。

実装してみたところ、対象の画像をもう一度押さないと元の透明度に戻らないようです。
こちらも表現が悪かったようです。
動きとしては、「画像(1)」を押下し、フェードアウトします。「画像(2)」を押すと、
「画像(1)」が元の透明度にフェードインし、「画像(2)」がフェードアウトする動きです。
何度もすみませんが、わかるようでしたらご教授をお願いいたします。