Zuerst scheint dies eine doppelte Frage zu sein, hier , aber da muss noch mehr herausgefunden werden.
Wie kann ich unter [Violation] warning in der Google Chrome-Konsole beheben?
[Violation] Zu einer Scroll-Blockierung wurde ein nicht passiver Ereignis-Listener hinzugefügt 'Mausrad' Ereignis. Erwägen Sie, den Ereignishandler als 'passiv' zu markieren die Seite reaktionsfähiger machen.
Hier ist das Code-Snippet, das aber mit der oben erwähnten [Violation] Warnung funktioniert.
Hier ist, wie ich versucht habe, es mit Modernizr passiveeventlisteners mit diesem Code Modernizr.passiveeventlisteners ? {passive:true} : false zu beheben, während ich einer Antwort folgte hier . Aber ich bekomme diese Fehlermeldung in der Konsole:
Es ist nicht möglich, Default innerhalb des passiven Ereignis-Listener-Aufrufs zu verhindern.
Es ist für mich klar, dass ich e.preventDefault() nicht verwenden kann, während {passive:true} verwendet wird, und das macht Sinn. Ich möchte nur wissen, wie ich Seitenrollen beim Scrollen eines DIV verhindern kann, während die Warnung [Violation] in der Konsole aufgelöst wird.
Hier ist das Code-Snippet, das nicht funktioniert und den oben erwähnten Fehler in der Konsole erzeugt.
Oder mache ich die Dinge unnötig kompliziert, weil es nur mit CSS erreicht werden kann?
Update1:
Dies ist eine reine CSS-Option für Webkit-Browser, die die Eigenschaft ::-webkit-scrollbar verwenden.
Würde so etwas funktionieren? Wenn Sie den Mauszeiger über das Scroll-Div bewegen, schalten Sie eine Klasse auf dem Body oder einem anderen übergeordneten Element mit einem Überlauf von hidden um und verhindern so, dass der Parent-Scroll über CSS erfolgt.
Sieh dir diese Geige an. Der Schlüsseltrick in meiner Antwort ist das Trennen der beiden Schriftrollen. In Ihrem Beispiel hatte der Körper die Schriftrolle, also hatte das feste Div einen Container mit Scroll. Wenn Sie ein Containerelement für die P-in-Bodies erstellen, in dem sich die Rolle befindet, und den festen Inhalt außerhalb platzieren, können Sie dies umgehen.
HTML (hinzugefügt den Container-Wrapper):
%Vor%CSS (HTML geändert, body & amp; hinzugefügt #container):
%Vor%Tags und Links javascript jquery css3 modernizr passive-event-listeners