jquery - 带有输入填充和 jQuery 1.9 的动画跳跃

Question

所以我只用纯 jQuery 测试了它，它工作正常。它与引导程序 CSS 有关。我正在尝试做一个简单的宽度动画，它可以工作，但是动画“跳跃”。看看小提琴，看看我在说什么：

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

您可以在没有引导 CSS 的情况下看到它可以正常工作：

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

HTML：

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

JavaScript：

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

编辑：

所以看起来填充是问题所在。还有其他人遇到这种情况吗？

Edit2：这是 jQuery 中的一个错误，修复版本为 1.9.1

Answer 1

出于好奇，如果使用 CSS 动画，动画对您来说是否更流畅：http: //jsfiddle.net/panchroma/yYYJE/？

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; 

}