jQuery hover бесконечный цикл

Question

Я пытаюсь использовать .hover, чтобы создать элемент HTML, похожий на светящийся. Мой код выглядит следующим образом:

var glow = $('<div class="glow">...</div>'); 

$(this).hover(function() { 
    glow.fadeIn(); 
}, function() { 
    glow.fadeOut(); 
} 

Эффект я получаю, что блекнет просто повторять снова и снова при наведении курсора мыши в бесконечном цикле. Когда я смотрю на консоль, функции обработчика hoverIn и hoverOut просто продолжают вызываться.

Любые идеи, что может быть?

Спасибо!

Answer 1

Я думаю, что вы хотите использовать этот код вместо:

var glow = $('<div class="glow">...</div>'); 

glow.hover(function() { 
    $(this).fadeIn(); 
}, function() { 
    $(this).fadeOut(); 
} 

или

var glow = $('<div class="glow">...</div>'); 

glow.hover(function() { 
    glow.fadeIn(); 
}, function() { 
    glow.fadeOut(); 
} 

Я считаю, сейчас ваш $ (это) неоднозначно, и, вероятно, не прикладывая парения() обработчик на правом объекте.

Возможно также, что вы опустили здесь что-то важное (например, где glow помещено в DOM).

Если хуже приходит к худшему, вы можете пропустить hover полностью и просто использовать mouseover и mouseout вместо этого, или если вы хотите получить действительно руководства обо всем этом, вы можете использовать bind с наведением мыши и MouseOut событий.

Фактически, поскольку вы видите повторяющиеся действия в одном событии мыши, это может указывать на то, что вы каким-то образом связали множество экземпляров вашего одиночного обработчика hover с объектом glow. Вы можете использовать unbind, чтобы удалить текущий обработчик, прежде чем связывать новый, если это окажется в этом случае, но избежать множественного привязки - лучшая стратегия, если вы сможете найти способ сделать это.

Надеюсь, это поможет!