3

これを行う簡単な方法があるはずです。他のいくつかの要素のクラス名を切り替えて、この変更をそのアクションに結び付けています。フェードインを開始するi変数セットがありますが、他の番号付きIDが存在する可能性がある場合はフェードアウトしたいと思います。これを行う簡単な方法はありますか？おそらく、このi変数と等しくないものに変更を実行するように指示する記号ですか？または、フェードインを開始する前にアクションを実行する一般的な番号記号ですか？

$('#SiteDescriptions' + i).animate({opacity: "1"}, 500);
$('#SiteDescriptions' + !i).animate({opacity: "0"}, 500);
4

4 に答える 4

4

ID を使用せず、セレクターに依存してください。代わりにクラスを使用します。

 $SD = $('.SiteDescription'); // cache jquery object
 $SD.on('click',function(){
     // fade out all with this class
     $SD.stop().animate({opacity:0},500);
     // fade in new active element 
     $(this).stop().animate({opacity:1},500);
 });

その ID 以外のものを選択しようとすると、それ以外のページ上のすべての要素が選択されます。そして、それはあなたが望んでいることではないと思います。

この方法ではなく、クラスの方法で行いますが、これはあなたが求めていることに近いです:

$('#SiteDescriptions'+i).animate({opacity : 1 },500)
 // I don't want to speculate on your dom structure, but if you are using id's
 // you still need a way to prevent from fading out everything on the page that
 // isn't the new action. So I am assuming that all the #SiteDescriptions are siblings
.siblings().not('#SiteDescriptions'+i).animate({opacity: 0}, 500);
于 2012-12-24T06:37:00.923 に答える
1

の場合、三項演算子を使用しiますboolean

$('#SiteDescriptions' + i).animate({opacity: (i) ? "1" : "0" }, 500);
于 2012-12-24T06:33:56.247 に答える
1

startsWithセレクターと を使用できますnot()。またfadeIn、 とはopacityfadeOutと同じですanimate

var site = $('#SiteDescriptions' + i).stop(true,true).fadeIn( 500);
$('div[id^="SiteDescriptions"]').not(site).stop(true,true).fadeOut(500)

また、アニメーションのトリガーがわからない...stop()同じ要素で別のアニメーションを呼び出すときにアニメーションが進行中の可能性がある場合に使用します

于 2012-12-24T06:50:55.710 に答える
1

これがあなたが望むものだと思います：

$('#SiteDescriptions' + i).animate({opacity: "1"}, 500);
$('[id^=SiteDescriptions]').not($('#SiteDescriptions' +i)).animate({opacity: "0"}, 500);
于 2012-12-24T06:49:28.297 に答える