darkroomengineering / lenis

How smooth scroll should be
https://lenis.darkroom.engineering
MIT License
8.58k stars 371 forks source link

"background-attachment" property causes janky scrolling on Safari #266

Open AaronMassingham opened 10 months ago

AaronMassingham commented 10 months ago

Describe the bug More of a PSA - I'm aware that position:fixed is on the radar but take care when using the background-attachment: fixed property too. This can cause a janky experience while scrolling.

To Reproduce Device: MacBook Pro 15" 2018 Browser ver: Safari v17.0 iOS: Sonoma v14.0

clementroche commented 7 months ago

closing this in favour of issue #103

23d1 commented 3 months ago

What was the issue, the linked issue is 404...?

feledori commented 3 months ago

@23d1 fixed the link

23d1 commented 3 months ago

@feledori thanks! Hmm, it seems to potentially be a slightly different topic.

The issue I'm running into is with gsap scrolltrigger and counteracting the smooth scroll with background-position to emulate background-attachment: fixed. Scrolling sort of grabs those elements, similar to how a page would work when touch scrolling on an iDevice. It's still smooth, but sort of springs out of place and back into into place with every scroll up and down, and then jitters into place across the easing. This is the case across Chrome and Safari.

feledori commented 3 months ago

hmm, @clementroche you know more.

clementroche commented 2 months ago

@23d1 please provide a reproduction link