исчезнуть скрытый div с JQuery

Question

Я пытаюсь добавить несколько скрытых div-ов при наведении курсора мыши и отпускании мыши, но, похоже, происходит то, что div-ы мерцают, а не просто исчезают.

изначально при создании div скрыты:

$(container).find('.myDiv').hide();  

тогда у меня есть 2 функции следующим образом:

function showDivs(container) {
    $(container).find('.myDiv').fadeIn('slow');
}

function hideDivs(bucketContainer) {
     $(container).find('.myDiv').fadeOut();
} 

и все это в следующем виде:

$('.container').live('mouseover', function() {
        showDivs(this);
});

$('.container').live('mouseout', function() {
        hideDivs(this);
}); 

Как мне избавиться от нечетного эффекта мерцания?

Answer 1

я предполагаю, что вы выполняете 'живые' блоки

$('.container').live('mouseover', function() {
        showDivs(this);
});

$('.container').live('mouseout', function() {
        hideDivs(this);
}); 

более одного раза.

Если вы это сделаете, вы добавите много событий mouseover, mouseout для ваших объектов DOMпотому что jQuery не заменяет живые привязки, а укладывает их в стек.

Так, например, если вы случайно запускаете свои живые блоки 10 раз, то при каждом наведении курсора мыши будет вызываться ваш живой ('mouseover') ... ...10 раз.

Это может выглядеть как мерцание: -)

Answer 2

jQuery API:

типы событий mouseover / mouseout могут вызывать много головных болей из-за пузырей событий.Например, когда указатель мыши перемещается по элементу Inner в этом примере, ему будет отправлено событие mouseover, а затем накапливается до Outer.Это может вызвать наш связанный обработчик при наведении мыши в неподходящее время.См. Обсуждение для .mouseenter () для полезной альтернативы.

Answer 3

Можете ли вы попробовать mouseenter/mouseleave вместо mouseover/mouseout?