Handling anchor links in Javascript is not necessary anymore since scroll-behavior: smooth;
allows smooth scrolling all over your site when clicking anchor links.
Additionally, the current Javascript implementation does not take into account CSS properties like scroll-margin-top
or scroll-padding-top
, which can cause major issues with user experience when there are fixed or sticky elements on the page (ex.: a fixed header).
Simply replacing the current Javascript implementation by a default setting of scroll-behavior: smooth;
on the body element would fix these issues, and remove unneeded Javascript.
+1 would really like to be able to use scroll-margin-top. It's also good future-proofing as CSS is only going to do more native scroll handling with time
+1 This is very annoying. Thought using scroll-margin-top would have been an easy fix to my sticky nav bar.
+1
+1 This is annoying.
I'm running today in the same problem. Really annoying that I cannot solve it with the simple css property: scroll-margin-top