'Page transition animation with JS

I am using Barba.js, GSAP + Locomotive scroll for making creative page transitions on my works. And currently looking for some examples about how to implement this kind of transition with these. Here is the prototype that explains what I want. (No frameworks, Vanilla JS)

enter image description here

I've tried looking for some good reference code for this on Codepen and other sites, can't find an exact example like this. especially with locomotive and GSAP. and tried to figure out how to set rules with Barba.js but it was too difficult for me and failed to implement it.(because the default transition is different than this.)

It would be great if you can guide me or give me some hints how to make this. Thank you very much🙏

javascriptcssgsap


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions