将高度/宽度动画化为“自动”

无法执行thing.animate({ "height": "auto" }); 。 因此，这是达西·克拉克（Darcy Clarke）的使该方法起作用的方法。 您实质上是克隆元素，删除当前造成该元素的固定高度，然后测量/保存该值。 然后，将真实元素设置为该值。

jQuery.fn.animateAuto = function(prop, speed, callback){
    var elem, height, width;
    return this.each(function(i, el){
        el = jQuery(el), elem = el.clone().css({"height":"auto","width":"auto"}).appendTo("body");
        height = elem.css("height"),
        width = elem.css("width"),
        elem.remove();
        
        if(prop === "height")
            el.animate({"height":height}, speed, callback);
        else if(prop === "width")
            el.animate({"width":width}, speed, callback);  
        else if(prop === "both")
            el.animate({"width":width,"height":height}, speed, callback);
    });  
}

用法

$(".animateHeight").bind("click", function(e){
    $(".test").animateAuto("height", 1000); 
});

$(".animateWidth").bind("click", function(e){
    $(".test").animateAuto("width", 1000); 
});

$(".animateBoth").bind("click", function(e){
    $(".test").animateAuto("both", 1000); 
});

翻译自: https://css-tricks.com/snippets/jquery/animate-heightwidth-to-auto/