JQuery переключатель при наведении курсора - предотвратить очередь

Question

У меня есть следующий код, который переключает видимость div при наведении другого div.Он работает нормально, за исключением того, что если вы многократно наводите курсор мыши, он ставит в очередь все переключатели:

$(document).ready(function() {
    $('.trigger').mouseover(function(){
        $('.info').toggle(400);
    }).mouseout(function(){
        $('.info').toggle(400);
    });
});

Я пробовал это, но, похоже, не работает (это создает проблемы с видимостьюпереключенный div и в итоге не отображается вообще)

$(document).ready(function() {
    $('.trigger').mouseover(function(){
        $('.info').stop().toggle(400);
    }).mouseout(function(){
        $('.info').stop().toggle(400);
    });
});

Как мне избавиться от очереди здесь?

Answer 1

Использование функции .dequeue () и .stop ()

.dequeue().stop()

Отличная статья об этом найдена здесь, я уверен, что она скажет вам, что вы хотите знать.

http://css -tricks.com / примеры / jQueryStop /

Кроме того, я бы использовал. show() and .hide() вместо .toggle() только для того, чтобы сохранить любую путаницу в jquery.

Редактировать: Обновлено

Проблема в том, что анимация не заканчивается, при использовании true, true она переходит в конец перед запуском другой.

* * Пример тысячи двадцать-одина * +1022 *

$('.trigger').mouseover(function() {
    $('.info').stop(true, true).show(400);
}).mouseout(function() {
    $('.info').stop(true, true).hide(400);
});

Answer 2

Вы должны попробовать это

$(".trigger").hover(function() { $(".info").stop(true).toggle(400); });