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"});
      }        
    });
});