：hover属性在jquery效果后重写，如何取回？

Question

我有一个动画功能...

    function flashGreen(e) {
                backg = e.css('backgroundColor');
                e.animate({ backgroundColor: "#5ccc96" }, 1000);
                e.animate({ backgroundColor: backg }, 500);
            }

用css这样

.container {
    padding:5px;
    background:#eaeaea;
}
.containerr:hover {
    border:1px #558ecb solid;
    background:#7dcdf2;
    padding:4px;
}

在我调用flashGreen函数之前，悬停按照需要工作，但在我调用该函数后，背景颜色不再变化，但边框仍然出现。

发生了什么事？我注意到jQuery在animate函数之后用backgroundColor为我的div添加了一个“style”属性。所以我认为“风格”覆盖了类属性。

在backgroundColor上调用动画后，如何让背景颜色悬停起作用。

Answer 1

正如您已经注意到的，jQuery为您的元素添加了style属性。您可以在动画完成后将其删除

e.animate({ backgroundColor: backg }, 500, function() {
    e.removeAttr("style");
});

Answer 2

这是优先/优先问题。由于动画为元素提供style="background-color"，因此优先于CSS文件。这是因为内联样式优先于任何非内联样式（至少在正常情况下）。

在我发布解释时，peirix发布了解决方案。