ScrollTrigger Effect

Does anyone know how I would go about adding this to Blocs?

https://codepen.io/creativeocean/pen/qBbBLyB

I can use the Code Widget for the HTML but where would I place the CSS and JS?

Thanks!

Hi John,

Use the code editor.

CSS in the CSS input zone and the JavaScript in the footer. You will need script opening and closing tags for the JavaScript.

GSAP is great.

But the example you link to, you won’t need additional CSS, you can use the class editor. Often these examples are not name spaced or with custom classes, it’s not always a direct copy and paste. For example adding styling directly to a Div will effect your entire site.

There are some really good GSAP courses around, worth investing to understand what’s happening.

You will also need to add the GSAP library, and based on the notes you need a GSAP plugin (scrollTo).

I had to look that one up. :slight_smile:

1 Like

GSAP is awesome, but not easy at all! There’s a lot to study before you will be able to create fancy animations.

I’ve used GSAP for the first time here:

1 Like

That’s why I suggested doing a course :grin:

I was working on a similar effect for my main website. But have since decided to work it a different direction. Still using GSAP though.

1 Like

Unaffiliated, but this is great, I have a lifetime membership. And you will progressively learn GSAP.

Same, haha.

Thanks Pete! I was able to get the code to work sort of but of course am completely lost when it comes to input zones, script tags, and GSAP.

1 Like

Thanks Jerry, I’ll take your word for it and leave this one for the coding pros.