прокрутка div с помощью jquery setTimeout & mouseenter & mouseleave

Question

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

var timer = null; 
    var moving_distance = $("#scroller").height()-($(window).height()-$("#slideshow").height()); 
    $("#scroller").mouseenter(function(event){ 

    if(timer) 
    { 
    clearTimeout(timer); 

     $("#scroller").animate({top:'-='+moving_distance},1000); 

    } 

}).mouseleave(function(event){ 

    if(!timer){ 

    timer = setTimeout(function(){ 

     $("#scroller").animate({top:'+='+moving_distance},1000); 
    },3000); 
    } 
}); 

Answer 1

У меня была успешная укладка нулевой анимации перед анимацией, которую я хочу, а не с помощью setTimeout.

Например,

var moving_distance = $("#scroller").height()-($(window).height()-$("#slideshow").height()); 
var firstEnter = true; 
$("#scroller").mouseenter(function(event){ 
    if (firstEnter) 
     firstEnter = false; 
    else { 
     $("#scroller").stop(); 
     $("#scroller").animate({top:'+=0', 3000); 
     $('#scroller').animate({top:'-='+$('#scroller').top()), 1000); 
    } 
}).mouseleave(function(event){ 
    $('#scroller').stop(); 
    $("#scroller").animate({top:'+=0', 3000); 
    $('#scroller').animate({top:'+='+moving_distance), 1000); 
}); 

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

HTH