Stop Fullpage.js scrollen, wenn Lightbox geöffnet ist, wieder aktivieren, wenn Lightbox geschlossen ist

Question

So verwende ich Fullpage.js für eine Website, die ich arbeite. Ich habe einen Abschnitt, der Bio's von Teamleitern enthält, die in einem Leuchtkasten mit Nivo Lightbox öffnen. Wenn Sie auf die Person klicken, öffnet sich ihr Leuchtkasten, aber wenn Sie durch ihre Informationen blättern (geschieht in Mobile), wird der Abschnitt verschoben.

fand ich diese Funktion von fullpage.js

$.fn.fullpage.setAllowScrolling(false); 
$.fn.fullpage.setKeyboardScrolling(false); 

Gibt es ein Ereignis, das ich testen kann, wenn Nivo Lightbox öffnet/schließt diese Funktion aufzurufen?

Beispiel hier: http://jeffreyroche.us/solarTestBed/#team/2 Klicken Sie auf jemanden dann scrollen Sie nach oben.

Answer 1

Sie sollten normalScrollElements von fullpage.js Plugin die Option verwenden:

normalScrollElements: (default null) Wenn Sie die Autoscroll vermeiden wollen, wenn sie über einige Elemente Scrollen, das ist die Option, die Sie muss verwendet werden. (nützlich für Karten, Scrollen divs etc.) Es erfordert eine Zeichenfolge mit den jQuery-Selektoren für diese Elemente. (Zum Beispiel: normalScrollElements: '# element1, .element2')

Und Sie könnten den Wert von normalScrollElementsTouchThreshold abhängig von Ihrem Leuchtkasten Markup ändern müssen:

normalScrollElementTouchThreshold: (Standard 5) Definiert den Schwellenwert für die Anzahl der Hops in der HTML-Knotenstruktur. Fullpage testet, ob normalScrollElements eine Übereinstimmung für die Scrollfunktion auf divs auf einem Touch-Gerät bietet. (Zum Beispiel: normalScrollElementTouchThreshold: 3)

Sie haben alle benötigten Informationen unter fullpage documentation.

Wenn Sie mehr Kontrolle benötigen, können Sie immer die Methode fullpage.js setAllowScrolling verwenden, um das automatische Scrollen zu erlauben oder zu deaktivieren. Auf diese Weise können Sie sie beispielsweise beim Öffnen eines Popups deaktivieren und nach dem Schließen erneut aktivieren.