SlideToggle Div动画

Question

我有以下jQuery代码。

$(function() {
    $('.clickme').click(function() {
        $('.totalthing').slideToggle('slow','easeInOutQuart', function() {
            // Animation complete.
        });
        $('.expandedcase').slideToggle('slow','easeInOutQuart', function() {
            // Animation complete.
        });
    });
});

此刻它会关闭其中一个div并同时打开另一个div。我想要它做的是关闭open div然后一旦它完全关闭它打开另一个。

Answer 1

您的意见应该指向正确的方向。如果您希望一个动画在另一个动画完成后启动，则将其移动到该功能。

$(function() {
$('.clickme').click(function() {
$('.totalthing').slideToggle('slow','easeInOutQuart', function() {
    // Animation complete.
    $('.expandedcase').slideToggle('slow','easeInOutQuart', function() {
        // Animation complete.
    });
});

});
});

Answer 2

尝试：

$(function() {
    $('.clickme').click(function() {
       var tot = $('.totalthing');
       var exp = $('.expandedcase');

       var frt = (tot.is(":visible"))?tot:exp;
       var lst = (tot.is(":visible"))?exp:tot;

       frt.stop().slideToggle('slow','easeInOutQuart', function() {
          lst.stop().slideToggle('slow','easeInOutQuart', function() {/*complete*/});
       });
    });
});