Question

因此，当某人填写某个表单的某个区域时，它会获取该ID并变为绿色。我希望绿色渐渐消失。出于某种原因，它只会淡入此代码。

var id = this.id  
$("#"+ id).css({border: '0 solid rgb(0, 255, 12)'}).animate({ borderWidth: 2}, "fast");

我从建议中尝试了这一点，但仍然没有让它发挥作用：

$("#"+ id).css(function(){
    $(this).animate({         backgroundColor: "#000000"     }, "slow");
}, function() {
    $(this).animate({         backgroundColor: "#a7bf51"     }, "slow");
});

Answer 1

尝试使用CSS动画，如果要在填写字段后执行某些操作，只需将focus更改为blur。

$("input").on("focus", function() {
  $(this).addClass("correct");
});

input {
  border: 2px solid #ccc;
  outline: 0;
  padding: .5em;
}

.correct {
  border: 2px solid #ccc;
  animation-duration: 3s;
  animation-name: fade;
}

@keyframes fade {
  0% { border-color: #ccc; }
  50% { border-color: rgb(0, 255, 12); }
  100% { border-color: #ccc; }
}

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

如何使JQuery CSS颜色渐渐消失？

1 个答案: