Oluwatobiju Judah

thanks @OSUblake for the help 🙏🏾

hey @akapowl thank you for the detailed explanation. I understand the current behavior more clearly now.

About the smooth scroll, yeah, I know. I'm only using Greensock's smoothscroll helper on mobile because the desktop view is all horizontal.

 

16 hours ago, OSUblake said:

Pretty sure you could just setup a scroll proxy for that. I'll mess around with that in a bit.

Hey @OSUblake, not to bug, but did you manage to try it out, eventually?

@OSUblake & @akapowl thanks for all the help so far. I removed locomotive scroll and implemented the horizontal and smooth scrolling with scrolltrigger as you suggested and they worked great. Well, except for the trigger on the element. Which seems stay at the point where the object is on load but doesn't follow the object on scroll, and additionally, weirdly goes upwards as I scroll. See codepen here 

See the Pen YzZMepa by tobijudah (@tobijudah) on CodePen

thanks, everything is set up now, including the scrollerProxy
see here: 

See the Pen YzZMxMr?editors=0011 by tobijudah (@tobijudah) on CodePen

thanks @Shehzad Asif 
added the loco css to my codepen now and horizontal scroll works well, but annoyingly, my content is still laid out vertically for some reason. 

yeah about scroller proxy, i removed it so I could figure out first why the horizontal scroll wasn't working properly

silly question but this is where I add the Loco CSS right?

meanwhile @OSUblake I've managed to set up a small(?) demo here: 

See the Pen JjWVKMz?editors=0011 by tobijudah (@tobijudah) on CodePen

hey @akapowl thanks for the reply. just tried that out and it completely breaks the layout for some reason

wrong thread sorry 😬

Hey @OSUblake, thanks for responding. Let me minimize the code to help make debugging and helping easier. Will reply as soon as I've done that.

Yes, I am. As for the horizontal scroll, as soon as I instantiated the scroll, I stopped it scroll.stop(), then the full screen video plays for 10 seconds before I start it, scroll.start(). So if you try to scroll during the first 10 seconds it won't work. After that everything is as normal, including mouse wheel scrolling.

here is the page link from the sandbox: https://ncfh6.sse.codesandbox.io/

I think I've properly setup ScrollTrigger with locomotive scroll using some examples seen in the forum, however I can't seem to get my animation to work properly. It triggers as soon as the page loads without me scrolling to the point I set my trigger.

here is a codesandbox link. https://codesandbox.io/s/cocky-darkness-ncfh6?file=/src/components/SectionThree/SectionThree.tsx

sorry I couldn't use codepen. don't know if that's fine?

edit: relevant files: App.tsx, SectionThree.tsx, instantiateScroll.ts

Thanks Zach, I'd just revert to the gsap-bonus.tgz file in this case, instead of using the private NPM registry.

to be clear, making these public isn't a big deal, yes? 
and thanks for your responses

not really. I'm aware I shouldn't put the bonus file in a public repo. So I've installed it using this method as shown in this video => 

My question is my auth token will be accessible in the .npmrc file if I make my repo public. So is that safe? If not, how can I hide my auth token in the .npmrc file

Hello, I installed the gsap-bonus file from the private registry using yarn. Is it safe to make the code public with my .npmrc config file which contains my auth token? And if not how can I go about it?