jQueryアニメーション中に入力フィールドを選択できませんか？

Question

この質問は、フォームのアニメーションスクリプトについてのthis questionの間接的な結果です。

それはそれはに着目している時に異なる幅に入力フィールドをアニメーション化し、そしてそのようにデフォーカス時にその元の幅にリセット単純なjQueryのスクリプトです：

$(document).ready(function() { 
$('input').focus(function() { 
    $(this).animate({ 
     width: "250px" 
    }, 500); 
}); 
$('input').focusout(function() { 
    $(this).animate({ 
     width: "200px" 
    }, 500); 
}); 
}); 

問題であり、その中に入力がアニメ化されている時間が500ミリ秒です。そこに何かがある場合、その入力の内容を選択することは不可能です。マイナーな問題のように見えるかもしれませんが、非常に刺激的で、フォームの全体的な使いやすさを損なう。

これを回避する手段はありますか？私は一つの事を見つけることができませんでした！

Answer 1

は単に

jsfiddle here

input { 
width: 200px; 
transition: .5s; 
-moz-transition: .5s; 
-webkit-transition: .5s; 
-o-transition: .5s;} 

input:focus { 
width: 250px; 
transition: .5s; 
-moz-transition: .5s; 
-webkit-transition: .5s; 
-o-transition: .5s; }