How to make animation when moving to another page?

Question

css

Hello! Help make animation when transitioning the page. I need to arrange this animation https://tympanus.net/Tutorials/PageRevealEffects/ The name of the animation in the drop-down select is simple, this animation works here without switching to another page, but I need to somehow arrange it when moving. It turns out that before the transition there should be an animation that the block on the right leaves to the left, and after loading the page, the same block is already leaving to the left and opens the entire site. Maybe someone knows some plugins or solutions tell me.

Answer 1

there is barba.js , most likely there are other solutions, but this is very good, in the world of react-view, etc., there are own rules

Answer 2

You will never break the animation when reloading the page. Therefore, in order for it to be smooth, you need to either make an implementation on Vanilla.js without reloading, i.e. within one page, or use a js-framework like Vue, React, Angular + animation of transitions between states.
However, you have raw materials right in front of your nose that you can download and parse.