Gourav Mukhija

Thank you @mvaneijgen, Finally I am able to get final expected outcome. e.g. https://codepen.io/Gourav-Makhija/pen/PoXbbea We can close this thread.

Hi GSAP Expert, I need your help to correct my demo. I am trying to make text fill up demo where text can have before and after fillup color (defined by editor). e.g. I have created demo https://codepen.io/Gourav-Makhija/pen/xxmjxrq Problem: On click of button background color need to fill with gradient effect. e.g. If we open https://cssgradient.io/ and put color #fc0000 and #3f51b5 and change slider from 0 to 100% for #3f51b5 color then same background gradient effect I am trying to put in my demo where Initial Text color: #fc0000 On button click: Fill up gradient animation linear-gradient(0deg, #FC0000 0%, #3F51B5 (0 to 100%)) After animation completion Text color: #3f51b5 Thanks,

Thanks @akapowl, Yes this is what I am looking for.

Thanks @mvaneijgen, Actually I am looking something similar https://codepen.io/hxd/pen/DLJKVE on scrolltrigger where instead of wave simple gradient color fillup like solution.

Hi Team, Is there any greensock example where text gradient fill up animation happen from bottom to top ? Example: I am trying to build Text fill up animation where text is having some default color (e.g. Red color Text) and on button click gradient fillup animation start from bottom to top like water is filling from bottom to top (e.g. bottom to top text color change from blue to red) CodePen: https://codepen.io/Gourav-Makhija/pen/PoXbbea Reference Link: (something similar but default text color should be predefined and gradient color on fill up) Thanks,

Thanks @Rodrigo, It is really very helpful.

Hi @GreenSock, Thank you quick response, Above demo is really very helpful. But still I am facing one issue e.g. In given updated pin https://codepen.io/Gourav-Makhija/pen/PoxxbxQ x: -80 and x: 0 for lines I am trying to change. Actual: When user click on "Animate Text" button then line first move to x: -80 px and then start words animation where words are appearing by fade effect. Expected: When user click on "Animate Text" button then line need to appear with word by word fade out text effect and once all the words get displayed on screen only then line need to move from position to 80px right. Thanks in Advance.

Hello everyone, I am new to GSAP forum and need some help for SplitText animation . e.g. I am trying to showcase Banner Text Line by line where each word is appearing once line is completely visible on screen and words in line follow some delay as per line index (e.g. x * lineIndex + y * wordIndex) and alpha value for words need to change from 0 to 100%. It would be very helpful if someone can guide me how to do this. Thanks,