javascript - 当最小/最大宽度匹配特定宽度时，jquery resize div

Question

如果窗口宽度小于 x px 或 %，如何将 div 的大小逐渐调整为 0，当窗口大于 x px 或 % 时，如何恢复到最大宽度？

Answer 1

这通常使用 CSS 完成，使用 CSS 过渡属性，然后使用 jQuery 的 addClass

CSS

#myElementToResize{
    width: 100px;
    -webkit-transition: width 2s;
    transition: width 2s;
}
.minimized{
    width: 0px;
}

JS

$(window).resize(function(){
    if ( $(window).width() <= 768 ){
        $("#myElementToResize").addClass("minimized");
    } else {
        $("#myElementToResize").removeClass("minimized");
    }
})