2009-12-13 37 views
8

我有一些jQuery的東西在這裏爲點擊動畫層。有時問題的內容可能會超過高度設置中分配的高度。有沒有什麼辦法可以修改這個動畫來將圖層設置爲最小高度或自動設置,而不是設置px數量?jquery動畫爲最小高度或自動

$(function() { 
    $(".showcart").click(function(){ 
     $("#cart").animate({ height: "250px" }).animate({ height: "200px" }, "fast"); 
    }); 
    $(".hidecart").click(function(){ 
     $("#cart").animate({ height: "250px" }).animate({ height: "0px"}, "fast"); 
    }); 
}); 

回答

3

不幸的是,你不能告訴它只是動畫,以適應什麼。要做到這一點,你必須已經知道正確的大小或有一種方法來計算它。

如果這一切發生在單個函數或單個插件中,您可能需要考慮將$(this).height()的值存儲在某個變量的某個位置,然後再展開它,因此您可以將其放回原來的位置是。

否則,一種可能性可能是將div放入您想要增長/縮小的div內,並使用get $('> div', $(this)).height()來獲取div內的高度,該div應該是其中內容的高度,無論您有多少弄亂外界div的高度。

1

這是一個棘手的問題,因爲它很大程度上取決於頁面的結構。如果您可以設置CSS最小高度,或者將另一個元素的高度作爲參考點,則可以對該大小進行動畫處理,使事情變得更加動態。不幸的是,在jQuery中沒有自動調整大小的方法。

$(this).css("min-height"); //Gets min-height CSS property 

// or.. 

$(this).height(); //Gets element height 

希望有所幫助。

16

我發現,你可以這樣做:

$("#cart").animate({ 'min-height': "250px" }, 'fast'); 

行情是這裏的關鍵的事情。

+2

作品!應該是最好的答案。 – Damathryx 2014-03-21 03:23:54