显示隐藏动画

Question

我有以下显示/隐藏功能：

    // Show/hide filters on mobile //
$("#openMobileFilters").click(function(){   
    showOrHideFilter(true);
});
$(".closeFilters").click(function(){
    showOrHideFilter(false);         
}); 

function showOrHideFilter(show) {
    $("#results-container, .navbar-inverse" ).toggleClass( "hidden-xs", show );
    $("#filter-column").toggleClass("hidden-xs", !show); 
}

我想在切换类时添加动画。类似的东西：

.animate({ width: 'hide' });

我不确定如何将其与功能结合起来？

非常感谢

Answer 1

尝试像这样修改你的功能：

function showOrHideFilter(show) {
    $("#results-container, .navbar-inverse" ).toggleClass( "hidden-xs", show );
    $("#filter-column").toggleClass("hidden-xs", !show); 
        if (show){
            $(this).animate({ width: 'hide' });
        }
}

希望它有用。