Animate before route change with anchor tag (Next.js)
Hey everyone!
I was wondering if it possible to animate a page before the route change?
I'm currently using a classic technic with Router.push(newUrl) when the animation is completed but I'm losing the anchor tag SEO benefit.
Any idea ?
Hey,
Based on these articles: https://dev.to/anxiny/page-transition-effect-in-nextjs-9ch
https://ellismin.com/2020/05/next-page-transition/
I came up with this:
https://github.com/rhernandog/next-gsap-transitions
Live sample (nothing fancy, just a proof of concept):
https://cranky-heyrovsky-83f0a9.netlify.app/
The only drawback in this approach is that you can't use the module approach for styling each page: https://dev.to/koraysels/comment/1f341
