2

在 CSS 中，我有几个带有悬停效果的 DIV 项目。如果我将鼠标悬停在一个元素上，则该元素具有另一种背景颜色。如果我将鼠标悬停在另一个项目上，则先前选择的项目具有默认背景颜色，而没有悬停。

我怎么能用 jQuery 做到这一点？我想为背景颜色设置动画，但想通过将鼠标悬停在另一个项目上来消除淡入淡出（动画）效果。我尝试使用窗口超时，但是在将鼠标指针滑过一些元素后，一切都在闪烁和窃听。

这是我用于鼠标悬停动画效果的代码：

$('.entry').mouseover(function() {
 (this).animate({ backgroundColor: "#0F410E" }, { duration: 500, queue: false });
});

已安装 jQuery 颜色插件 ;)

4

2 回答 2

1

你需要做这样的事情：

请轻弹jsfiddle的代码，我会看一下，但试试这个：

我不确定使用的原因是什么，queue and duration我认为您知道:)因此您正在使用它。

希望对事业有所帮助。

var items = '.entry'
$(items).hover(function() {
    // Mouseover state
    $(this).animate({ backgroundColor: "#0F410E" }, { duration: 500, queue: false });
}, function() {
    // Mouseout state
    $(this).animate({ backgroundColor: "black" }, { duration: 500, queue: false });
});
于 2012-07-15T22:01:57.930 回答
1

对于元素的动画background-color，因为 jQuery 本身不会为颜色设置动画，您应该使用jQuery Color插件。

这个插件安装了一个cssHook允许 jQuery.animate()在两种颜色之间进行动画处理的插件。

于 2012-07-15T22:02:20.430 回答