javascript - jquery で if ステートメントを使用してアニメーションを制限する

Question

リンクをクリックすると上に飛ぶようにアニメーション化されたdivを作成したいのですが、リンクが以前にクリックされていない場合のみ、元の位置にあることを意味します。私のifステートメントは現在次のようになっています：

$("#tutorialslink").click(function(){
 if($(".tab").position().top < "0px"){
$("#bottuts,.tab").animate({top : "-=350px"});
}

});

誰かがそれを修正する方法を教えてもらえますか? 私は JavaScript と jquery をまったく初めて使用するので、ばかげた構文エラーがあればご容赦ください。

ありがとう。

Answer 1

この関数を使用.one()して、クリック イベント ハンドラーが起動されたらデタッチします。

$("#tutorialslink").one("click", function() {
    $("#bottuts, .tab").animate({
        top: "-=350px"
    });
});

Answer 2

文字列に < 演算子を使用しようとしています。次のように、トップを整数 0 と比較するだけです。

$("#tutorialslink").click(function(){

   if($(".tab").position().top < 0){
      $("#bottuts,.tab").animate({top : "-=350px"});
   }
});

Answer 3

以下に例を示します: http://jsfiddle.net/3BSw7/

var $tab = $(".tab");

$("#tutorialslink").click(function (e) {
  e.preventDefault(); // Prevent default so link isn't followed

    $tab.each(function () { // Loop through elements with 'tab' class
      var $this = $(this); // $(this) refers to each looped element

      if ($this.position().top <= 200) { // compare to a number and not a string
          $this.animate({top: "+=150px"});
      }        
    });
});