Question

我想制作一个动画的div，点击一个链接即可向上飞行，但只有在之前没有点击链接时才意味着它仍处于原始位置。我的if语句目前看起来像这样：

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

});

有人能告诉我怎么解决吗？我是javascript和jquery的新手，所以请原谅任何荒谬的语法错误！

感谢。

Answer 1

我会使用.one()函数使click事件处理程序在触发后分离：

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

Answer 2

您正在尝试使用＆lt;字符串上的运算符。只需将顶部与整数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"});
      }        
    });
});

使用带有jquery的if语句来限制动画

3 个答案: