Javascript 使用悬停在div上的Jquery fadeIn和fadeOut问题

我有以下代码：

var x;
x=jQuery(document);
x.ready(inicializarEventos);

function inicializarEventos()
{
    var x;
    x=jQuery(".Caja2");
    x.hover(entraMouse,saleMouse);
}


function entraMouse()
{
    jQuery(this).fadeOut();
}

function saleMouse()
{
    jQuery(this).fadeIn();
}

问题是，当我将鼠标移到框上时，它开始不断地淡入淡出，直到停止鼠标移动

另一个糟糕的原因是，如果我把鼠标移入和移出盒子的速度比淡出速度快几倍，它就会一次又一次地产生效果

---

我需要一些东西，当鼠标返回框上方时停止动画。

也许您可以使用一个布尔变量，比如说它“已褪色”，并相应地将其设置为true或false？

当您调用fadeOut（）时，它最终将使该项完全不可见，这可能触发mouseOut事件

也许您可以用一个非常小的数字使用fadeTo（）方法，这样它就不会消失：

function entraMouse()
{
    jQuery(this).fadeTo("fast",0.01);
}

function saleMouse()
{
    jQuery(this).fadeTo("fast",1.0);
}

关于第二个问题：

如果在框上运行鼠标时动画正在“生成”，则可以先调用stop（）进行修复。像这样：

jQuery(this).stop().fadeOut();


jQuery(this).stop().fadeIn();

---

这可能是由于冒泡效应，假设您有一个div，其中包含一些内容：

你好 世界

---

然后，Hello span和World Paragraph的悬停事件会在div的悬停事件侦听器中捕获。

我遇到了类似的问题，并通过以下方法解决了此问题：

function entraMouse()
{
    if (!jQuery(this).is(':hidden')) jQuery(this).fadeOut();
}

function saleMouse()
{
    if (jQuery(this).is(':hidden')) jQuery(this).fadeIn();
}

---

您使用的jQuery版本是什么？我相信stop（）函数是在jQuery1.3中添加的。此外，我还将考虑使用mouseenter和mouseleave事件来代替悬停。此外，如果你的基本元素有一个透明的背景，IE6即使在元素上，当你在子元素之间移动时，也会不断地触发mouseout事件。