Enhance in-page navigation experience by scrolling to the element that the <a href="#hashtag">
linked to so that it feels like taking an elevator.
I used this plugin in my blog's React component.
import TzScrollTo from 'tz-scrollto'
...
<a href="#test" onClick={e=>{
e.preventDefault();
tzScrollTo(e.target,{
// millisecond
duration: 600,
// timing function
// maybe it's overkill to use a spring animation library like `react-spring`
easing: 'linear'
})
}}
/>
...
For those who want to use spring animations, I'd recommend react-spring
, react-motion
.