Help to set up cookie to only play animation on first visit

[vickybower]

I have created an animation which plays when a visitor lands on the home page. However if they navigate to another page then back to the home page, there is a quick flash of the end of the animation before it starts again. 

 

To get around this I am thinking of possibly setting a session cookie for the animation to only play on the first visit but I'm not sure how to do this. 

Any recommendations or help gratefully appreciated TIA.
 

[akapowl]

Hello @vickybower

 

Here is an example I quickly threw together based on the stackoverflow thread below.

 

https://stackoverflow.com/questions/2144386/how-to-delete-a-cookie

 

[This codepen example will only work properly when viewed in debug mode, though]

 

See the Pen vYQGEGB by akapowl (@akapowl) on CodePen

 

 

 

Setting up cookies really isn't GSAP related though, so I would suggest reading up on the topic yourself, as there can be a lot more involved you might not think about at first (like expiration of cookies, security etc.). This should be a good starting point:

 

https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie

 

 

 

To be honest though, setting a cookie in that scenario to me sounds more like a 'patch' that won't stop the actual 'bleeding'.

 

The description of your problem sounds like you are using some sort of SPA environment, like maybe React or Vue Routing?

 

If we at least had some more information about your code-structure, or even a minimal demo to look at, I'm pretty sure we'd find a better solution.