javascript - jQuery 切换延迟以及类和淡入淡出

Question

所以我有以下代码:

$('[data-hook="chat"]').click(function () {
        $('[data-hook="case"]').toggleClass('col-sm-12 col-sm-9');
        $('.chat').delay(500).fadeToggle('slow');
});

在应用 col-sm-9 时效果非常好类然后在聊天中淡出(请注意，这是 col-sm-12 元素上的 CSS 宽度转换，因此 jQuery 500ms 上的 fadeToggle() 延迟)。我的问题是我能否彻底扭转这一点，以便在淡出并重新应用时 col-sm-12延迟应用于 toggleClass()和 fadeToggle是即时的吗？

干杯，奥的斯。

Answer 1

参见 fadeToggle()描述然后你可以这样做:

$('.chat').fadeToggle('slow', 'swing', function() {
    $('[data-hook="case"]').delay(500).toggleClass('col-sm-12 col-sm-9');
});

更新:
您可以使用 toggle() :

$('[data-hook="chat"]').toggle(function() {
    $('[data-hook="case"]').toggleClass('col-sm-12 col-sm-9');
    $('.chat').delay(500).fadeToggle('slow');
}, function() {
    $('.chat').fadeToggle('slow', 'swing', function() {
        $('[data-hook="case"]').delay(500).toggleClass('col-sm-12 col-sm-9');
    });
});