jQuery颜色插件：onMouseOver动画导致FF3.5.5闪烁答案

【问题标题】：jQuery color plugin: onMouseOver animation causes flickering in FF3.5.5jQuery颜色插件：onMouseOver动画导致FF3.5.5闪烁
【发布时间】：2010-12-27 08:14:15
【问题描述】：

我正在尝试更改鼠标悬停和鼠标悬停时 div 的背景颜色。在 MouseOver 上立即变为黄色，在 MouseOut 上缓慢淡出。

函数 hilightel(keydiv)
{
$('#'+keydiv).animate({ backgroundColor: '#ffffd3' },1);
}
函数 lolightel(keydiv)
{
$('#'+keydiv).animate({ backgroundColor: '#ffffff' },300);
}

内容

但是，当鼠标移到 div 内的文本上时，它会认为我已经鼠标移出，所以会严重闪烁。

无效的替代方案：
- animateToClass 不支持背景颜色，所以我使用的是“颜色”插件
- 我听说 switchClass 在 Chrome 中不起作用
- 不能使用 .hover，因为它们会在页面中动态命名为 div，所以需要一个通用函数

提前谢谢...

标签： jquery jquery-animate mouseover flicker

【解决方案1】：

为什么不简单地为 div 分配一个类，然后使用 .hover 来定位它们？

编辑

试试这个：

$(".myclass").hover(
function(){
    $(this).animate({ backgroundColor: '#ffffd3' },1);
    },
    $(this).animate({ backgroundColor: '#ffffff' },300);
    }
);

【讨论】：

嗨，GD，如果我为他们分配一个类并定位该类，那么它们会同时改变颜色，并且不会突出显示您将鼠标悬停在哪一个？我想我可以在页面加载时解析页面上的所有元素并将它们绑定以监视鼠标悬停/移出，但这似乎很倒退......？
刚刚在另一个线程上发现了这个，我认为这就是你所指的 - 会给它一个 bash... $('.MyPanels').live("mouseover", function() { //做事 });

【解决方案2】：

最终解决方案：

$(document).ready(function()
{
$('.a_editableitem').bind('mouseenter', function() { $(this).animate({ backgroundColor: '#ffffd3' },25); });
$('.a_editableitem').bind('mouseleave', function() { $(this).animate({ backgroundColor: '#ffffff' },250); });
});

虽然有时仍会“卡”在黄色上，但闪烁已停止。

【讨论】：