.animate的jQuery對圖像的底部而不是頂部

Question

我試圖做功能

document.getElementById('testImage').style.height='75px'; 

$("#testImage").animate({ 
    height:'0px', 
    width:'100px' 
}); 

它有我的形象完美的效果相反，但我希望動畫收縮可見向底部的形象，而不是頂部。這可能嗎？

Answer 1

你只需要找到一些方法將圖像修復到問題區域的底部。例如，可以通過將容器設置爲position: relative，將動畫元素設置爲position: absolute和bottom: 0來實現。

Answer 2

使用CSS，設置這些規則爲你的形象：

position:relative; 
bottom:0px; 

確保它的容器具有適當的高度。

Answer 3

我在一家提琴這個工作對你：

http://jsfiddle.net/Ku6vV/

$("#testImage").animate({ 
    height:'0px', 
    width:'100px', 
    top:'300px' 
}); 

的CSS：

#testImage { 
    position:relative; 
    top:0; 
}