Question

我正在尝试进行3阶段动画，其中打开的框最小化，它们都向左滑动，点击框展开。最终动画，选中的框展开，当它被称为第二个动画的参数时重复3x，但是如果我单独调用它就可以正常工作。

$("#box2").click(
    function(){
      box = 2;
      if(boxopen==box)return;
      $("#box"+boxopen).animate({height:"-=30%", width:"-=10%", top:"+=20%", fontSize:"14px"}, 500, null,
      function(){
        $("section").animate({right:"+=25%"},500,null,
        function(){
          $("#box"+box).animate({height:"+=30%", width:"+=10%", top:"-=20%"}, 500);
          $("#box"+boxopen).css("z-index", "8");
          $("#box"+box).css("z-level", "9");
          boxopen = box;
        });
      });
    });

Answer 1

我不知道您的HTML是怎样的，但可能是您的点击正在冒泡到其他元素并导致此行为。要防止这种情况发生，请使用stopPropagation()

EX：

$("#box2").click(
    function(e){
      e.stopPropagation();
      box = 2;
      .....

Answer 2

我认为您正在寻找jQuery#stop()，它会停止匹配元素上当前正在运行的动画。在使用.stop()之前尝试拨打.animate()，如下所示：

// instead of:
$('section').animate(…);
// try this:
$('section').stop().animate(…);

jQuery animate（）重复3次

2 个答案: