下面是一个混合使用jQuery和CSS3动画的解决方案。

http://jsfiddle.net/padfv0u9/2/

从本质上讲，你首先将颜色更改为“闪光”颜色，然后使用CSS3动画让颜色逐渐消失。你需要改变过渡持续时间，以使初始的“闪光”比淡出更快。

$(element).removeClass("transition-duration-medium");
$(element).addClass("transition-duration-instant");
$(element).addClass("ko-flash");
setTimeout(function () {
    $(element).removeClass("transition-duration-instant");
    $(element).addClass("transition-duration-medium");
    $(element).removeClass("ko-flash");
}, 500);

其中CSS类如下所示。

.ko-flash {
    background-color: yellow;
}
.transition-duration-instant {
    -webkit-transition-duration: 0s;
    -moz-transition-duration: 0s;
    -o-transition-duration: 0s;
    transition-duration: 0s;
}
.transition-duration-medium {
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;
}

使用jQuery 1.10.2，这个脉冲两次下拉菜单，并将文本更改为错误。它还存储已更改属性的值以恢复它们。

// shows the user an error has occurred
$("#myDropdown").fadeOut(700, function(){
    var text = $(this).find("option:selected").text();
    var background = $(this).css( "background" );

    $(this).css('background', 'red');
    $(this).find("option:selected").text("Error Occurred");

        $(this).fadeIn(700, function(){
            $(this).fadeOut(700, function(){
                $(this).fadeIn(700, function(){
                    $(this).fadeOut(700, function(){

                        $(this).find("option:selected").text(text);
                        $(this).css("background", background);
                        $(this).fadeIn(700);
                    })
                })
            })
        })
});

通过回调完成-以确保没有动画丢失。

你可以使用这个很酷的库在你的元素上制作任何类型的动画效果:http://daneden.github.io/animate.css/

一个脉冲效果(离线)JQuery插件适合你正在寻找什么?

您可以添加一个持续时间，以便及时限制脉冲效果。

正如J-P在评论中提到的，现在有他更新的脉冲插件。 见他的GitHub回购。这是一个演示。

这可能是一个最新的答案，而且更简短，因为自从这篇文章以来，事情已经有所巩固。需要jquery-ui-effect-highlight。

$("div").click(function () {
  $(this).effect("highlight", {}, 3000);
});

http://docs.jquery.com/UI/Effects/Highlight

我正在用这个。虽然尚未在所有浏览器上测试。 按照你喜欢的方式修改它，

用法:hlight ($ (" # mydiv "));

function hlight(elementid){
    var hlight= "#fe1414"; //set the hightlight color
    var aspeed= 2000; //set animation speed
    var orig= "#ffffff"; // set default background color
    elementid.stop().css("background-color", hlight).animate({backgroundColor: orig}, aspeed);
}

注意:你需要一个jquery UI添加到你的头。