Jump to content
Search Community

ScrollTrigger Horizontal with animation

BeatlesBOB test
Moderator Tag

Recommended Posts

Hi @Cassie thank you very much for your reply, I'm sur it will help now or later. I'm actually struggling on even more basic thing since I'm discovering Gsap.

Like in the codepen sample when I remove markers nothing happen it's like markers unlock the scroll.

To do the expect effect i was using like Intersection observer but I'm sur we can know current section using only Gsap witch I'm sure it's more relevant. 

Link to comment
Share on other sites

46 minutes ago, BeatlesBOB said:

Like in the codepen sample when I remove markers nothing happen it's like markers unlock the scroll.

Sorry I don't understand this, could you rephrase it at all?

(p.s It's not working right now because you're trying to pass index to section.clientHeight and that's not a function.)

Link to comment
Share on other sites

It totally makes sense that if ScrollTrigger puts the end marker in there, it would make your page taller. Right? I'm struggling to see what the confusion is about here. And of course markers are only intended to be used during development, so they wouldn't affect a deployed site. 

 

If you want the page to be scrollable, you have several options: 

  1. Don't set pinSpacing: false (I'm curious why you did that)
  2. Set the height of your containing element to be the correct height according to however many sections you have. Maybe 400vh, for example. 
  3. Set the height dynamically via JavaScript (same concept, just on the JS level instead of CSS)
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...