0

私は小さなスクリプトに取り組んでいます。これでほぼ完了です。必要な変更はほとんどありません。ここでデモを参照してください。私がやりたいのは、「こんにちは友達」と言うボックスは1つだけですが、すぐに2〜3個のボックスをクリックすると、複数のボックスに「こんにちは友達」と表示されます。

$(document).ready(function(){
$(".main").click(function(){

  if($('.active').length){
    // Slide down previous theater 
    $(this).animate({
        top: '+=0',
    }, 200, function() {
        $(".main").removeClass("active");
    });     
    $(".active").next("div").animate({
        top: '+=270',
    }, 200, function() {
    }); 
  }

    // slide up new theater
    $(this).animate({
        top: '-=0',
    }, 200, function() {
        $(this).addClass("active");
    });     
     $(this).next("div").animate({
        top: '-=270',
    }, 200, function() {
    }); 

});
});
4

1 に答える 1

2

アニメーション中に発生する速いクリックから保護しようとしている場合は.stop(true, true)、次のアニメーションを開始する前に、既存のアニメーションを停止するためにおそらく を使用する必要があります。これにより、次のアニメーションを開始する前に一貫した状態になることが保証されます。

http://jsfiddle.net/jfriend00/uquB3/.stop(true, true)の各アニメーションにを追加すると、すばやくクリックしても混乱しなくなります。


また、top: '+=0'orのアニメーションtop: '-=0'は何もしません。jQuery に top の現在の値を取得して追加0するように指示していますが、これには目に見える結果はありません。

おそらく、 を取り出して+=使用top: 0するつもりですか、それともそのアニメーションはまったく必要ありませんか?

于 2013-03-30T17:38:20.440 に答える