如何在jQuery1.9中切换具有多个目标的排队效果？

我已经创建了一个函数来设置一个div的动画，然后在单击时淡入另一个div。 当我再次单击时，动画将反向运行。 该函数起作用，但动画部分跳到其指定点而不设置动画，并且仅在反向运行时

我相信左边距是在淡入淡出之前设置的，所以在淡入淡出完成后会跳到设置点，但我不知道如何解决这个问题

我的问题

var flag = 0;
$('#btn1, #btn2').click(function() {
    if (flag == 0) {
        $('#LftCol').fadeOut({complete: function(){
            $('#CtrCol').animate({marginLeft: 0});
        }});
        flag = 1
    }
    else if (flag == 1) {
        $('#CtrCol').animate({marginLeft: 251},{complete: function(){
            $('#LftCol').fadeIn();
        }});
        flag = 0
    }
});

如何运行淡入淡出，然后在单击按钮时使用两个不同的目标制作动画。然后在“切换”上单击以反向运行。jquery 1.9

var toggle = false;
$('#btn1, #btn2').click(function(){
    $('#CtrCol').animate({marginLeft: toggle ? 251 : 0},{complete: function(){
        $('#LftCol').fadeToggle();
    }}); 
    toggle = ! toggle;
});

我的解决方案

var flag = 0;
$('#btn1, #btn2').click(function() {
    if (flag == 0) {
        $('#LftCol').fadeOut({complete: function(){
            $('#CtrCol').animate({marginLeft: 0});
        }});
        flag = 1
    }
    else if (flag == 1) {
        $('#CtrCol').animate({marginLeft: 251},{complete: function(){
            $('#LftCol').fadeIn();
        }});
        flag = 0
    }
});

---

您可以只设置一个标志来知道动画运行的方向，并在.click函数中进行检查

if (flag == "right") // run right anim
  flag = "left"
else // run left anim
  flag = "right"

---

编辑：保持回调

您只需设置一个标志来知道动画运行的方向，并在.click函数中进行检查

if (flag == "right") // run right anim
  flag = "left"
else // run left anim
  flag = "right"

---

编辑：保持回调

我真的不知道你想如何制作动画。只需在click函数中使用if，并在回调中设置相应的标志。我真的不知道你想如何制作动画。只要在click函数中使用if，并在回调函数中设置相应的标志，你就知道了！也许有一种更别致的方法，但那应该行得通。如果在使用多个动画触发器时遇到任何问题，请在回调中移动标志分配。然后使用。停止（）。你知道了！也许有一种更别致的方法，但那应该行得通。如果在使用多个动画触发器时遇到任何问题，请在回调中移动标志分配。并使用.stop（）。