Wie reibungsloses Scrollen in allen Browsern zu ermöglichen

Question

Ich habe kürzlich festgestellt, dass wenn Sie ein div mit übergelaufenem Inhalt haben, der scrollbar ist, in Chrome können Sie reibungslos Scrollen von diesem div zum Rest des Körpers, aber in Safari, du kannst nicht. Anstelle eines fließenden Übergangs stoppt der Bildlauf, wenn Sie den oberen oder unteren Rand des enthaltenen Elements erreichen, und Sie müssen erneut scrollen, um mit dem Bildlauf auf dem Körper zu beginnen. Für das Projekt, an dem ich gerade arbeite, ist es wichtig, dass Safari das reibungslose Scrollen auf die gleiche Weise wie Chrome ermöglicht. Für das Leben von mir kann ich nicht herausfinden, wie das geht. Jede Eingabe ist dankbar, danke für Ihre Zeit!

Answer 1

Sie können versuchen, Einstellungen für ein CSS-Element, das scrollbar ist, zu gehen. Obwohl ich nicht helfen kann, zu viel Sie ohne den Code zu sehen, versuchen Sie diese Implementierung:

-webkit-overflow-scrolling: touch; 
    overflow-y: scroll; 

I gelten diese in der Regel für iOS-Geräte und es funktioniert der Trick. Nicht 100% sicher, ob es Ihrem Problem helfen wird.

Answer 2

Safari trennt Scroll-Gesten absichtlich für verschiedene Elemente, sodass der Benutzer deutlich erkennen kann, welches Element gescrollt wird.

Natürlich können Sie JavaScript verwenden, um dies auf eine hacky Weise zu lösen. Zum Beispiel können Sie ScrollTop von body auf den Betrag setzen, den der Benutzer gescrollt hat, wenn der div den unteren Rand erreicht hat.