2013-01-24 1 views
0

그래서이 함수를 순수한 jQuery로 테스트 해봤는데 정상적으로 동작한다. 부트 스트랩 CSS와 관련이 있습니다. 간단한 너비 애니메이션을하려고하는데 애니메이션이 "뛰어"움직인다. 내가 무슨 말 볼 바이올린에서보세요 :입력 패딩과 jQuery를 이용한 애니메이션 급상승 1.9

http://jsfiddle.net/qVz9M/2/

당신은 그것을 잘 작동 부트 스트랩 CSS없이 볼 수

http://jsfiddle.net/qVz9M/4/

HTML :

<input class="input-small find" type="text" > 

자바 스크립트 :

$(".find").focus(function() { 
    $(this).animate({ 
     width: "200px" 
    }, 500); 
}).blur(function() { 
    $(this).stop().animate({ 
     width: "90px" 
    }, 500); 
}); 

편집 :

그래서 PADDING이 문제인 것 같습니다. 이 문제가 발생하는 사람은 누구입니까?

Edit2가 : http://jsfiddle.net/panchroma/yYYJE/이는 호기심의 아웃 1.9.1

+0

애니메이션은 맥 사파리, 크롬과 파이어 폭스 –

+0

나는 윈도우 7에있어 ​​나를위한 부드러운? –

답변

0

의 수정 릴리스와 jQuery를 버그, 그것은 CSS 애니메이션을 사용하는 경우 당신을 위해 어떤 부드러운 애니메이션은 무엇입니까? 다른 사람이 창문에 무슨 일이 일어나고 확인할 수 있습니다 -

CSS

input.find{ 
width:90px; 
transition: all .5s; 
-moz-transition:all .5s; /* Firefox 4 */; 
-webkit-transition: all .5s; /* Safari and Chrome */ 
-o-transition: all .5s; /* Opera */ 
} 
input.find:focus{ 
width:200px; 

} 
+0

예 - 사용 하겠지만 IE8과 호환되어야합니다. –