Jump to content
Search Community

GSAP + LocomotiveScroll + Horizontal pined + ScrollTrigger

rgdesign test
Moderator Tag

Recommended Posts

Hi everybody, first time here, i am "pinned" on some things and may be someone can help me. So explanation:

i use locomotive for the smooth scroll, then i could add/remove classes to any item when is visible on screen while scrolling vertical. But, i´m unable to do the same thing on the pinned horizontal sections. 
I´m including bootstrap 4 css just in case.

So basically, i need to add/remove classes into the horizontal elements when they are inview, this ones:

> scroll-horizontal > ... > .fadeInUp

That´s why you will see two horizontal wrappers, one using just half window´s width and the other just full width (second one),  trying to detect the inview inside there, but no way, i couldn´t.

Anybody knows how to do it?

Also, at first i tried based on this: 

See the Pen WNjaxKp by GreenSock (@GreenSock) on CodePen


But, i didn´t find a way to use something like that and also width smooth scrolling.

Thanks!!

See the Pen JjygBpL by rg-the-selector (@rg-the-selector) on CodePen

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...