javascript - SlideToggle Div 动画

Question

我有以下 jQuery 代码。

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

目前它关闭了一个 div 并同时打开另一个。我想要它做的是关闭打开的 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*/});
       });
    });
});