Hot to fill background color into text word

[renny]

See the Pen JjLGYGW by solace-digital (@solace-digital) on CodePen

[mvaneijgen]

@renny to bad you didn't take a swing at coding it your self. I find the best way to learn is to just build it and even if your code doesn't work share it, this way others can give you pointers on why your thought process wouldn't work.

 

What I did is copy the text and placed them underneath each other (I have add SCSS to your codepen, because I find that easier to write) and then add a clipPath to the fill element. Which is then animated from the bottom to the top. I'll leave adding it to ScrollTrigger to you, but be sure to post back if you have any trouble, but I'll then encourage you to include the none working code. 

 

See the Pen PoRmwbW?editors=0110 by mvaneijgen (@mvaneijgen) on CodePen

[renny]

i know that, but haven't any idea how to impletemnt that.

 

Thanks fir this solution 

 

Last one how to rever that fill color ? like if we scroll up to fill out black color

[mvaneijgen]

6 minutes ago, renny said:

Last one how to rever that fill color ? like if we scroll up to fill out black color

 

That I'll leave to you. Just try hooking it up to ScrollTrigger and if you have any trouble post back here.  A great place to start is https://greensock.com/docs/v3/Plugins/ScrollTrigger