RESOLVED INVALID259478
Weird scrolling behavior with JS-positioned sticky elements 
https://bugs.webkit.org/show_bug.cgi?id=259478
Summary Weird scrolling behavior with JS-positioned sticky elements
Jeroen Zwartepoorte
Reported 2023-07-25 07:32:58 PDT
Created attachment 467114 [details] Safari reproduction When you scroll down when the page is already at the top of the viewport, sticky elements behave weirdly. See the video. They are dragged down as well.
Attachments
Safari reproduction (529.13 KB, video/quicktime)
2023-07-25 07:32 PDT, Jeroen Zwartepoorte 		no flags
Details
Chrome video (855.32 KB, video/quicktime)
2023-07-25 07:33 PDT, Jeroen Zwartepoorte 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Jeroen Zwartepoorte
Comment 1 2023-07-25 07:33:50 PDT
Created attachment 467115 [details] Chrome video Chrome behaves correctly: the page does move down, but the contents in the page does not move.
Simon Fraser (smfr)
Comment 2 2023-07-25 09:20:53 PDT
Please provide the URL of the site on which you see this.
Jeroen Zwartepoorte
Comment 3 2023-07-25 09:28:36 PDT
I'm not a public accessible website unfortunately. I'm trying to create a codepen of the issue, but having no luck so far.
Jeroen Zwartepoorte
Comment 4 2023-07-25 09:42:54 PDT
@smfr I can't reproduce it in a codepen. Any chance you're willing to live debug this via a call?
Simon Fraser (smfr)
Comment 5 2023-07-25 10:42:04 PDT
Does the page listen for scroll events and reposition content based on scrollY etc?
Jeroen Zwartepoorte
Comment 6 2023-07-25 11:05:10 PDT
Yes it listens for scroll events and it toggles an attribute based on scrollY (to add a box-shadow when something becomes stuck).
Jeroen Zwartepoorte
Comment 7 2023-07-25 11:05:42 PDT
The element it toggle the stuck attribute on is the same element that is "misbehaving" in the video.
Simon Fraser (smfr)
Comment 8 2023-07-25 11:15:11 PDT
In webkit your scrollY values become negative when rubber banding, so you should clamp them to 0.
Simon Fraser (smfr)
Comment 9 2023-07-25 11:18:35 PDT
Improving compatibility in this area is tracked by bug 201556.
Jeroen Zwartepoorte
Comment 10 2023-07-25 11:19:38 PDT
Thanks, I think I know where to look then.
Jeroen Zwartepoorte
Comment 11 2023-07-25 11:31:15 PDT
Yep, I can confirm it's my own fault :) Closing as resolved/invalid.
Simon Fraser (smfr)
Comment 12 2023-07-25 11:50:36 PDT
It's a common issue. Even amazon.com does it.
Note You need to log in before you can comment on or make changes to this bug.