Как предотвратить обратный вызов, если анимация остановлена ​​в jQuery? - PullRequest
1 голос
/ 16 сентября 2011

Я работаю над проектом, содержащим много полезных элементов.Я написал анимацию, которая делает это:

При наведении курсора изображение исчезает, и в качестве обратного вызова, исчезает div, содержащий информацию. Затем при исчезновении мыши информационный div исчезает, а в качестве обратногоизображение возвращается обратно. Я использую плагин hoverIntent.

Моя проблема в том, что если вы задержитесь на div, то все будет хорошо.Но если вы остановитесь, скажем, на 300 мс, анимация остановится, но обратный вызов, показывающий информационный div, все еще вызывается, игнорируя событие отсутствия мыши.Это приводит к тому, что информация всегда остается неизменной ...

Вот мой код:

 var infoPaneSettings = {
    sensitivity: 3,
    interval: 200,
    timeout: 500,
    over: showPane,
    out: hidePane

    }   

function showPane() {
    var entry = $(this);
    $('.featured_img', entry).fadeTo(1000, 0, 
        function(){
        $('.infoPane', entry).fadeTo(200, 1);
        });


}

function hidePane() {
    var entry = $(this);
    $('.infoPane', entry).fadeTo(300, 0, 
        function(){
        $('.featured_img', entry).fadeTo(200, 1);
        });
}

$('.entry').each(function(){
    $(this).hoverIntent(infoPaneSettings);
});

Надеюсь, вы мне поможете!

1 Ответ

4 голосов
/ 16 сентября 2011

Используйте http://api.jquery.com/stop/ на элементе перед началом новой анимации.Это предотвратит запуск обратного вызова.

...