Page refresh with each link clicked

[geoffdgeorge]

I'm trying to work with AniLinks and the TransitionPortal to create a fixed navbar separate from the animation of the rest of my page, but each link clicked seems to refresh the page and re-lazy load my images as the rest of the page is animated. Is there a way to prevent this reload effect and keep the link animation?

Here's what the behavior looks like:

Also, here's a link to my repo, in case you want to try it yourself: https://github.com/geoffdgeorge/geoffdgeorge.com

[TylerBarnes]

Hey @geoffdgeorge , you should use a persistent layout for anything you want to persist across pages instead of transition-portal. The portal is good for if you need to render an animation element outside of the markup of the entering or exiting page. For example in anilink, the cover animation has a big block of colour that covers the page. Check https://transitionlink.tylerbarnes.ca/docs/installation/#usage-with-gatsby-plugin-layout for more info. Let me know if this doesn't solve your issue.

[geoffdgeorge]

Ah ha! Serves me right for not clicking through every link of the docs. Adding a resolve option worked beautifully. Thanks for your help!

[TylerBarnes]

Glad to hear that helped!