JS / jQuery - сбросьте MouseLeave при повторном запуске MouseOver - PullRequest
Новая
       15

JS / jQuery - сбросьте MouseLeave при повторном запуске MouseOver

0 голосов
/ 10 марта 2012 
$("#profile_bar").mouseover(function()
{
    $("#profile_bar")stop(true).animate({
        marginTop : "0px"
    }, 300);
});

$("#profile_bar").mouseleave(function()
{
    $("#profile_bar").stop(true).delay(2000).animate({
        marginTop : "-70px"
    }, 300);
});

На данный момент у меня есть код, который вы видите выше. Я хочу, чтобы это произошло:

При наведении курсора на div #profile_bar он перемещается на 70 пикселей вниз. Когда я ухожу из этого div и возвращаюсь к нему в течение 2 секунд, он должен остановить функцию MouseLeave, и на самом деле ничего не должно происходить.

Может кто-нибудь дать мне подсказку или помочь?

Ответы [ 2 ]

1 голос
/ 10 марта 2012 
var timeouts = {};
$("#profile_bar").mouseover(function()
{
    clearTimeout(timeouts['profile_bar']);
    $("#profile_bar").stop(true).animate({
        marginTop : "0px"
    }, 300);
});

$("#profile_bar").mouseleave(function()
{
    timeouts['profile_bar'] = setTimeout(function(){
        $("#profile_bar").stop(true).animate({
            marginTop : "-70px"
        }, 300);
    }, 2000);
});
0 голосов
/ 10 марта 2012

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

Редактировать: Я проверил свое предложение на jsFiddle и не увидел разницы между использованием clearQueue или нет.Затем я увидел, что api docs говорит (выделено мое):

Метод .delay () лучше всего подходит для задержки между эффектами jQuery в очереди.Поскольку он ограничен - , он, например, не предлагает способ отменить задержку -. Delay () не является заменой нативной функции JavaScript setTimeout, которая может быть более подходящей для определенных случаев использования.

Итак, ответ AlienWebguy на самом деле нужен вам ...

...