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

可以简单地使用CSS进行这样一个简单的转换......

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; }

在jQuery动画期间无法选择输入字段？

1 个答案: