jQuery는 요소의 왼쪽에 애니메이션을 적용합니다.

Question

저는 컬러 블록을 가지고 있으며 매번 눌러야합니다.

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

오른쪽으로 이동합니다. 왼쪽면을 어떻게 축소시킬 수 있습니까?

CSS :

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

}

HTML :

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

Answer 1

은 당신이있는 당신은 플로트 청산의 일종을 적용 할 수 있습니다 (부모 내부 #blue 요소를 float: right 수 필요하다면).

하거나 position: relative;

Answer 2

사용

#blue { 
float: right; 
} 

또는 부모의 CSS와 #blue

#blue's_parent { 
text-align: right; 

} 

#blue { 
display: inline-block; 

} 

Answer 3

시도를 변화하는 부모 내부 #blue 요소에 position: absolute 및 right : 0;를 할당 코드 아래

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

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

} 

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

}, 1000); 

});

빈으로 시도하십시오. http://codebins.com/codes/home/4ldqpca