Section background color on scroll (custom code)

[CreativeRobot]

Hey guys,  Santa 🎅  is stuck and cant get it to work. Im very green and not a pro coder at all. 🤯

 

is it possible to mix / implement locomotive.js to this custom code? Is there a way to optimize the existing gsap coz the code acts weird. I know it is poorly written.

 

All help appreciated. Thanks.

 

Jolly regards.

See the Pen GRMJoza by ren-winther (@ren-winther) on CodePen

[Cassie]

Hi there CreativeRobot,

You you don't seem to have the right markup for the code you're trying to run. You're looking for .section-background and .page-section and a bunch of attributes that don't exist. I think you're using jQuery too and that's not loaded. I'm afraid it's pretty hard for us to help you without a working demo.

Aside from that - yes it would be possible to add locomotive scroll, anything is possible with enough custom code and time! However I'm afraid that we can't help with that in these forums as it's not a GSAP tool.

Carl from snorkl.tv has covered this implementation though so maybe this link will help - good luck!
https://www.snorkl.tv/scrolltrigger-smooth-scroll/

[akapowl]

Maybe one of these threads can help - one contains an example for scrubbing background-color changes and one for triggering timebased background-color changes - in both there is locomotive scroll included.