JQuery FadeIn И FadeOut проблема с использованием наведения на DIV

Question

У меня есть этот код:

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();
}

Проблема в том, что, когда я перемещаю мышь над полем, он начинает постепенно исчезать и исчезать, пока не остановит движение мыши.

Другим плохим поведением является то, что если я перемещаю мышь внутрь и наружу коробки в несколько раз быстрее, чем затухание, она продолжает делать эффект снова и снова.

Мне нужно что-то, что останавливает анимацию, когда мышь возвращается над окном.

Answer 1

По второму выпуску:

Если ваша анимация «накапливается» при наведении курсора мыши на поле, это можно исправить, сначала вызвав stop (). Вот так:

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


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

Answer 2

Когда вы вызываете fadeOut (), это в конечном итоге делает элемент полностью невидимым, что, вероятно, вызывает событие mouseOut .

Возможно, вы можете использовать метод fadeTo () с очень низким числом, чтобы он не исчезал:

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

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

Answer 3

У меня была похожая проблема, и я решил ее с помощью:

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

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

Answer 4

это, вероятно, из-за пузырькового эффекта, скажем, у вас есть div с некоторым содержанием:

Hello

Мир

затем событие hover для диапазона Hello и World paragrapgh перехватывается в обработчике событий при наведении мыши на div.

Answer 5

Может быть, вы можете иметь логическую переменную, скажем, "is_faded_out", и соответственно установить ее в true или false?