Clone Project

GSAP Dynamic Page Transition Cloneable

Created by
Ludovic Losco
Similar Projects
Oops! Something went wrong while submitting the form.

0 Comments

Be the first to leave a comment.
Loading
User is typing...
No Name
Set
4 years ago
Moderator
This is the actual comment. It's can be long or short. And must contain only text information.
(Edited)
No Name
Set
2 years ago
Moderator
This is the actual comment. It's can be long or short. And must contain only text information.
(Edited)
Load More
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Load More
Description:  
Description from Webflow:  
Enhance your Webflow website with dynamic page transitions using a bit of GSAP magic! How to Implement: 1. Assign a Data Attribute: To activate the transition on your internal links, add a custom attribute: `data-page-name="Your Page Name"` to each link. You can personalize this by using CMS fields for dynamic page names. 2. Modify the Code: If desired, you can locate and adjust the code in the 'Custom Code' section within the site settings. Things to Note: - This implementation works seamlessly with internal links. External links (those directing to other websites) will not trigger the transition. - Ensure that the 'transition-cover' and 'transition-text' classes are properly set up in your Webflow project as per the GSAP code provided. Get in Touch & Stay Updated: For more Webflow tips, tricks, and updates, follow me on Twitter: https://twitter.com/ludoviclosco Enjoy!
Tags from Webflow: 
gsap,  gsapanimation,  customcode,  pagetransitions,  page transition,  dynamic,  javascript,  customjavascript
.