HORIZONTAL CAROUSEL ON SCROLL - GSAP Elementor ScrollTrigger

Published: 30 September 2024
on channel: Nicolai Palmkvist
11,822
379

✅ Save time - get Elementor template:
https://lifeonablock.com/template-hor...

✅ Code and CSS classes used:
Code: https://lifeonablock.com/code-slider/

In this Elementor GSAP tutorial, I’ll go through how I built a horizontal image slider that moves when you scroll. To create the ScrollTrigger animation effect I use the GSAP library and integrated it into Elementor. This makes it unique, as image slides or carousels are often navigated by clicking on arrows instead of being triggered by scrolling. Everything is built with the Elementor flexbox container without any additional plugins.

What I love most about this horizontal image slider is that it breaks the usual pattern of vertical scrolling. It looks so cool and makes website visitors stop because it slides in a way they haven’t seen before.

So, to summarize, in this video, I’ll show you step-by-step how to create this in Elementor for your own website, using only a few lines of code.


Watch video HORIZONTAL CAROUSEL ON SCROLL - GSAP Elementor ScrollTrigger online, duration hours minute second in high quality that is uploaded to the channel Nicolai Palmkvist 30 September 2024. Share the link to the video on social media so that your subscribers and friends will also watch this video. This video clip has been viewed 11,822 times and liked it 379 visitors.