JQuery未完成(改为重复动画)

Question

谁能解释一下为什么我的.close点击功能没有完成，而是几乎完成了，并在单击关闭按钮之前弹回原来的状态？

打开菜单可以很好地工作，所以我尝试从本质上删除所有css类，并向后执行所有操作，但似乎不起作用；我在这里重新创建了基本问题；http://jsfiddle.net/gavinfriel/MvQsT/1507/

这是我的JS，它有问题

$(document).ready(function() {
  $(".close").click(function() {
    $(this).animate({
      'opacity': '0'
    }, 200);
    $("#project3").animate({
      'height': '50px'
    }, 1500);
    $("#project3").removeClass("cursor-fix");
    $("#project3").removeClass("no-info");
    $("#project3").removeClass("stick-subtitle");
    $(".dark3").removeClass("project-open");
    $(".toggle-more").css("display", "none");
  });
});

感谢大家的帮助！

Answer 1

您的元素.close在#project3中，在.close上使用e.stopPropagation()单击以解决您的问题。

在这里试试：http://jsfiddle.net/2uth18rq/

$(".close").click(function(e) {
     e.stopPropagation()
    $(this).animate({
      'opacity': '0'
    }, 200);
    $("#project3").animate({
      'height': '50px'
    }, 1500);
    $("#project3").removeClass("cursor-fix");
    $("#project3").removeClass("no-info");
    $("#project3").removeClass("stick-subtitle");
    $(".dark3").removeClass("project-open");
    $(".toggle-more").css("display", "none");
  });