Question

我尝试过这种结构：

field.animate({border: '1px solid rgb(173, 26, 26)'}, 3000, function() {
    $(this).css('border', 'none');
});

但是

border: '1px solid rgb(173, 26, 26)'

不能工作。我做错了什么？

Answer 1

编辑：正如@showdev所述，只能使用jQuery对颜色进行动画处理。你需要一个像jQuery UI这样的插件，或者使用CSS转换。

您需要单独修改每个属性：

$('div').animate({
                   borderWidth: '1px',
                   borderColor: 'rgb(173, 26, 26)'
                 }, 2000, function() {
                       $(this).css('border', 'none');
});

div{
    border: 20px solid green;
    padding: 2em;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div></div>

Answer 2

请尝试此

var intervalID = setInterval(function() {
    $('input').removeClass('red').css('border','none');
}, 3000);

DEMO

我如何在文本字段周围显示红色边框3秒钟？

2 个答案: