So deaktivieren Sie Multiple-Scroll-Effekt in Osx und Feuer Scroll-Ereignis einmal pro Bildlauf

Question

Ich muss Navigation wie jquery.fullPage organisieren: Wenn ich einmal blättern - gehe ich zum nächsten Abschnitt.

Ich habe versucht, jquery.mousewheel dafür zu verwenden, aber es scheitert in MacOS mit Touchpad oder Trackpad oder APPLE Magic Mouse: Es scrollt mehrere Folien pro Scroll.

Ich habe versucht, diese Lösung zu verwenden: https://github.com/jquery/jquery-mousewheel/issues/36#issuecomment-67648897

Es funktioniert in Chrome in Ordnung, aber es funktioniert nicht in FF und hat Fehler in Safari.

Dies ist einfache Demonstration der Ausgabe: http://jsfiddle.net/ss5LueLx/13/

$slider.on('mousewheel', function(event) { 
    if (event.deltaY>0) { 
     slider.prevSlide(); 
    } else { 
     slider.nextSlide(); 
    } 
}); 

Answer 1

ich diese Aussage in meinem SeaMonkey Browser getestet und es funktioniert nicht.

var delta = e.type == 'mousewheel' ? e.originalEvent.wheelDelta * -1 : 40 * e.originalEvent.detail; 

Nur für den Fall, schaute ich auf die deltaY und es funktioniert: 1 in eine Richtung und -1 in der anderen, so wie man in den beiden anderen Implementierungen bestimmt, die Sie haben.

console.log(e.deltaY); // view console in FireBug 

Mit Blick auf der Event-Struktur in Firebug, kann ich sehen, dass der Ereignistyp „Mausrad“, und doch kann ich nicht ein wheelData Feld in der originalEvent sehen.

Und obwohl es ein Detailfeld gibt, aber das bleibt auf Null.

Ich würde mir vorstellen, dass Sie versuchen, zum nächsten Artikel nur einmal zu gehen, wenn Sie +/- 3 erreichen. Ich würde so etwas vorschlagen, diese Leistung zu vollbringen:

// somewhere, initialize to zero 
var current_position = 0; 


// on mousewheel events 
current_position += e.deltaY; 

// you had a x 40 which would indicate that the limit is about 120/40 
// if 3 is too small, you can always increase it to 5 or event 10... 
if(current_position <= -3) 
{ 
    slider.nextSlide(); 
    current_position = 0; 
} 
else if(current_position >= 3) 
{ 
    slider.prevSlide(); 
    current_position = 0; 
} 

Andernfalls könnten Sie überprüfen, ob Ihr allowScroll Flag funktioniert wie erwartet. Ich programmiere Objekte auf diese Weise nicht, so dass ich mir nicht sicher bin, ob es korrekt ist oder nicht. (Ich verwende die prototype Syntax, die nützlich ist, wenn Sie Klassen erweitern möchten.)