Zatrzymaj bieżące zdarzenie scrollTo, gdy użytkownik przewija

Question

Używam zmienionej wersji http://nick-jonas.github.io/windows/, która pozwala użytkownikowi przewinąć wewnątrz DIV różne sekcje, które następnie wskoczą z powrotem na miejsce.

Ponieważ jestem przewijanie DIV Mam zastąpić:

$('.windows').animate({scrollTop: scrollTo }, options.snapSpeed, function(){ 
        if(!completeCalled){ 
         if(t){clearTimeout(t);} 
         t = null; 
         completeCalled = true; 
         options.onSnapComplete($visibleWindow); 
        } 
       }); 

z:

$('.windows').scrollTo($visibleWindow , options.snapSpeed, { onAfter:function(){ 
        if(!completeCalled){ 
         if(t){clearTimeout(t);} 
         t = null; 
         completeCalled = true; 
         options.onSnapComplete($visibleWindow); 
        } 
       }}); 

tak można zobaczyć, aby przejść do widocznego div użyć wtyczki scrollTo zamiast opierania się na złożone przesunięcia, takie jak poprzedni kod.

Błąd, który zauważyłem zarówno w oryginalnym kodzie, jak i moim własnym, polega na tym, że jeśli zacznie się przyciąganie, a następnie użytkownik przerwie to, przewijając, w końcu będzie walczył z wydarzeniem przewijania, aby przewinąć zawartość. Jeśli więc scrollTo przewinie w dół o 100 pikseli, a następnie spróbuje przewinąć do góry o 300 pikseli za pomocą paska przewijania przeglądarki, ekran stanie się szybszy wraz z przewijaniem zdarzenia i przeglądarki.

Jakieś pomysły na to, jak mogę to powstrzymać? Mam nadzieję, że teraz, gdy używam wtyczki scrollTo, łatwiej będzie sobie z tym poradzić.

Do tej pory próbowałem:

$('.windows').bind("scroll mousedown DOMMouseScroll mousewheel keyup", function(e){ 
    if (e.which > 0 || e.type === "mousedown" || e.type === "mousewheel"){ 
     $(this).stop().unbind('scroll mousedown DOMMouseScroll mousewheel keyup'); 
    } 
}); 

Ale to zatrzymuje przyciągania dzieje w ogóle ... jakieś pomysły na poprawki?

Answer 1

mógłbyś spróbować

$('.windows').bind("scroll mousedown DOMMouseScroll mousewheel keyup", function(e){ 
if (e.which > 0 || e.type === "mousedown" || e.type === "mousewheel"){ 
    $('.windows').stop(true,false); 
} 
}); 

składnia jest .Zatrzymaj ([clearQueue], [jumpToEnd])

Answer 2

This answer do another question wydaje się rozwiązać problem. Zasadniczo po prostu wiążesz się z scroll, wheel i innymi zdarzeniami, które mogą wskazywać, że użytkownik przewija, a następnie sprawdź, czy użytkownik nie przewija. Jeśli tak, zatrzymaj animację.

Oto funkcję w pytaniu (kredyt do Mottie):

$('body,html').bind('scroll mousedown wheel DOMMouseScroll mousewheel keyup', function(e){ 
    if (e.which > 0 || e.type == "mousedown" || e.type == "mousewheel") { 
     $("html,body").stop(); 
    } 
}); 

podstawie mojego zrozumienia problemu, co chcesz zastąpić $("html,body") i $('body,html') powyżej $('.windows'), tak:

$('.windows').bind('scroll mousedown wheel DOMMouseScroll mousewheel keyup', function(e){ 
    if (e.which > 0 || e.type == "mousedown" || e.type == "mousewheel") { 
     $(".windows").stop(); 
    } 
}); 

There's a working demo.