jQuery爲元素的左側設置動畫效果

我有一個顏色塊，每當我按下它時，我都希望它縮小。jQuery爲元素的左側設置動畫效果

$('#blue').click(function(){ 
    $(this).animate({width: '90%'},1000); 
});

但它在右側。我如何讓它在左側收縮？

CSS：

#blue{ 
height:250px; 
width:500px; 
background-color:blue;

}

HTML：

<div id='blue'></div>

來源

2012-07-02 RnD

讓我看看你的html和css。（但我認爲你的塊使用風格「float：right;」，你應該改變它） – see613

http://stackoverflow.com/questions/5627260/jquery-animate-width-from-left-to-right'：）'可能有幫助。休息下面的第一篇文章很好。 –

你可以float: right父裏面#blue元素（您可能要應用某種形式的浮動結算，如果需要的話）。

或只是分配position: absolute和right : 0;到#blue元素，父裏面有position: relative;

來源

2012-07-02 11:10:31 fcalderan

謝謝，流利地工作。在6分鐘內接受答案。 – RnD

我很樂意提供幫助。 - 我也會生產小提琴，但今天它似乎不工作 – fcalderan

@ F.Calderan不錯。 +1 –

使用

#blue { 
float: right; 
}

或改變父母的CSS和#blue

#blue's_parent { 
text-align: right; 

} 

#blue { 
display: inline-block; 

}

來源

2012-07-02 11:14:59 Rab

試代碼如下

<div id='blue'> 
</div> 

#blue{ 
    height:250px; 
    width:500px; 
    background-color:blue; 

} 

$('#blue').click(function() { 
$(this).animate({ 
    "width": "-=50px" 

}, 1000);

}）;

在Bin上試試http://codebins.com/codes/home/4ldqpca

來源

2012-07-02 11:55:52 gaurang171

jQuery爲元素的左側設置動畫效果

回答

相關問題