javascript。隱藏方向更改

Question

jQuery中有hide（）函數。

當您添加的持續時間爲隱藏功能，像這樣

$('#myclass').hide(1000); 
<div id="myclass"> 
    <p>yolo</p> 
</div> 

它將從底層做起和動畫了一秒多的過程。

我的問題是我該如何改變它從頭開始的方向。

Answer 1

從文檔的.hide(duration)：

當提供持續時間，普通對象或「完整」函數時編輯，.hide()成爲一種動畫方法。 .hide()方法同時動畫匹配元素的寬度，高度和不透明度。當這些屬性達到0時，display樣式屬性設置爲none，以確保該元素不再影響頁面的佈局。

元素只顯示動畫並離開，因爲它位於左上角。

有它在另一個方向上的動畫，它不得不定位在不同角：

#myclass { 
    position: absolute; 
    bottom: 0; 
    right: 0; 
} 

實施例：http://jsfiddle.net/W7hqy/

Answer 2

你不能躲方法做到這一點假設你使用jQuery，你將需要使用動畫像這樣

$('element').animate({ 
    marginLeft: '-400px' 
}, '5000', function(){ 
    $(this).hide() 
}); 

演示：​​

Answer 3

嘗試此。

$('div').on('click', function(){ 
    $(this).animate({ 
     width: 0 
    }); 
}); 

演示：http://jsfiddle.net/e6BBA/1/