Jump to content
Search Community

GSAP CAROUSEL WITH INNER PARALLAX

Dennyno test
Moderator Tag

Go to solution Solved by Dennyno,

Recommended Posts

Hi all.
What's the trick here, to enable the inner parallax between slides?
How to achieve with a common swiper slider, instead of the custom js-slider used by the Codrops team?

Something ease as a slider with 4/5 slides with inner sections with this kind of parallax?

I've seen and know to ho make horizontal scrolling, as many and many demos.. just dont know how to make this effect.

Thanks

See the Pen PoKvyXv by DedaloD (@DedaloD) on CodePen

Link to comment
Share on other sites

Hi @Dennyno,

 

This thread has some great parallax slider advice.

 

 
Saying that - everything you need is in that demo, and there's a tutorial for it too on the codrops site. I would probably recommend reading the tutorial and stripping the code back bit by bit to figure out how it works. 

 

  • Like 1
Link to comment
Share on other sites

  • Solution
24 minutes ago, Cassie said:

Hi @Dennyno,

 

This thread has some great parallax slider advice.

 

 
Saying that - everything you need is in that demo, and there's a tutorial for it too on the codrops site. I would probably recommend reading the tutorial and stripping the code back bit by bit to figure out how it works. 

 

That demo seems really what I was looking for!
I will add a scrub and a pin and test it.
Thanks!

Yep the Codrops article (doenst) says it all, but they did many nested files and the tutorial vs final result is a bit (aka a lot) different, and there are many and many files that are missing from their easy demo.

Btw thanks for the hint!

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...