चेतन ऊँचाई / चौड़ाई "ऑटो" के लिए - सीएसएस-ट्रिक्स

यह करना संभव नहीं है thing.animate(( "height": "auto" ));। तो यह डार्सी क्लार्क के काम करने की अनुमति देने की विधि है। आप अनिवार्य रूप से तत्व को क्लोन करते हैं, वर्तमान में तत्व को प्रभावित करने वाली निश्चित ऊंचाइयों को हटाते हैं, और मूल्य को मापते / सहेजते हैं। फिर आप उस मूल्य के लिए वास्तविक तत्व को चेतन करते हैं।

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); ));