search

rafgraph / react-router-hash-link

Hash link scroll functionality for React Router
https://react-router-hash-link.rafgraph.dev
MIT License
732 stars 62 forks source link

[Chrome/Safari on iOS] Page Jump is offset #70

Closed gnacoding closed 3 years ago

gnacoding commented 3 years ago

Has anyone the same issue, that on iOS devices (I tested it on an iPhone 6, 7 Plus & XS) the page jump stops around 20-30% before where the id is nested?

My Scenario: I have an application with two routes [A & B]. The Hashlink is on route A. After clicking on a HashLink the page jump starts correctly to B but is slightly offset. I only could reproduce this behaviour on iOS devices. Android (Chrome), Windows (Firefox & Chrome), MacOS Catalina (Firefox, Chrome, Safari) works great (the page jump centers the addresed id and the content is in the center of the viewport)!. Tried to reproduce it in dev as well as a build and hosted it on a server. The issue still occurs on iOS devices.

I'm curious if anyone else had this specific behaviour and if they found a solution?

rafgraph commented 3 years ago

I have not experienced this issue.

Do you experience this issue on the demo site? https://react-router-hash-link.rafgraph.dev/

Do you experience this issue when using the scrollIntoView() api directly without using this component?