Create a Horizontal Scroll With Snap in WordPress using Motion.page
Welcome to another official video tutorial for Motion.page!
In today's tutorial, we will learn how to create a section that pins on top of the page during scrolling, and horizontally scrolls inner sections until it unpins and continues with a vertical scrolling. On top of that, you will learn how to easily implement a snapping behaviour to your horizontal scroll with a short snippet that goes into the custom code field.
Custom Code snippet:
snap: 1 / (gsap.utils.toArray(".h-scroll-section").length -1)
Chapters:
00:06 - Intro / Example
01:13 - Edit with Oxygen
01:28 - Create Sections
02:24 - Create the Horizontal Container
03:38 - Create a Pin Trigger
05:19 - Open up Motion.page
05:50 - Pin Settings
07:28 - Create Animation
08:55 - Add GSAP Code for Snap
10:52 - Outro
Don't know Motion.page yet? Learn more at https://motion.page
Watch video Create a Horizontal Scroll With Snap in WordPress using Motion.page online without registration, duration hours minute second in high quality. This video was added by user MotionPage 25 May 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 11,688 once and liked it 147 people.