:hover 属性在 jquery 效果后被覆盖，如何取回它？答案

【问题标题】：:hover property overriden after jquery effect, how to get it back?:hover 属性在 jquery 效果后被覆盖，如何取回它？
【发布时间】：2011-04-03 22:53:19
【问题描述】：

我有一个动画功能...

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

像这样的css

。容器 { 填充：5px；背景：#eaeaea; } .containerr：悬停{ 边框：1px #558ecb 实心；背景：#7dcdf2; 填充：4px； }

在我调用 flashGreen 函数之前，悬停可以正常工作，但是在我调用该函数之后，背景颜色不再改变，但边框仍然出现。

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

在 backgroundColor 上调用 animate 后，如何让我的背景颜色悬停工作。

【问题讨论】：

标签： jquery css jquery-ui

【解决方案1】：

正如您已经注意到的，jQuery 为您的元素添加了一个style 属性。您可以在动画完成后简单地删除它

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

【讨论】：

谢谢，您可能需要将倒数第二个 ')' 更改为 '}'，以防将来有人引用它。

【解决方案2】：

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

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

【讨论】：