Closed zslabs closed 5 years ago
What are you using for smooth scrolling effect? Would be great if we would have reproduction for it
Hey @pieh I'm just using scroll-behavior: smooth
for that.
Private repo unfortunately - was hoping the .gif
and gatsby info
would help. Do you happen to know if any of the logic around anchor scrolling or calculation has changed recently?
Alternatively you could use this: https://www.npmjs.com/package/react-scrollchor It works for me with the last Gatsby version.
Alternatively you could use this: https://www.npmjs.com/package/react-scrollchor It works for me with the last Gatsby version.
Appreciate the reply; but the tableOfContents
MarkdownRemark property is automatically generated HTML; and removing that CSS property doesn't impact the position; so it's not something a 3rd party module is going to resolve since I don't have access to those click events.
@zslabs mind creating a reproduction? This way it's easier to prioritize this one
@zslabs mind creating a reproduction? This way it's easier to prioritize this one
You can see it live by visiting https://www.gremlin.com/community/tutorials/chaos-engineering-monitoring-metrics-guide/ and interacting with the sidebar links; click it once, then when the element is scrolled-down to it; click that same item again, and it moves the position.
Hiya!
This issue has gone quiet. Spooky quiet. 👻
We get a lot of issues, so we currently close issues after 30 days of inactivity. It’s been at least 20 days since the last update here.
If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!
Thanks for being a part of the Gatsby community! 💪💜
Hi guys!
I faced similar issue. It turned out that using "scroll-behavior: smooth" was the origin of the problem. For some reasons, it literally blocked any anchor link to work at all.
Haven't figured out why quite yet.
@NicoGim Appreciate the insight there!
Personally I don't really need using smooth scrolling, so I'll stop here. Too busy to chase down on that bug. Also, I am not a javascript/gatsby/react guru. Have you tried using react-scrollchor as @Resumane suggested? As weird as it sounds, it might actually solve your problem.
Personally I don't really need using smooth scrolling, so I'll stop here. Too busy to chase down on that bug. Also, I am not a javascript/gatsby/react guru. Have you tried using react-scrollchor as @Resumane suggested? As weird as it sounds, it might actually solve your problem.
For certain parts of the site that are auto-generated (like the table of contents) it wouldn't be worth the effort to attempt to integrate, but I decided to just remove scroll-behavior: smooth
as you mentioned as it's just not worth the headache. Thanks again!
Description
Scrolling to anchor links from within the generated
tableOfContents
links incorrectly positions itself on first click. A second-click resolves this. No changes in configuration; onlypackage.json
updates.Steps to reproduce
Gatsby 2.0.31:
Gatsby 2.0.50:
Environment