Vanilla javaScript: Text Reveal Effect On Scroll

Hi Guys,

Back with another video where we will be creating a text reveal on scroll effect using vanilla javascript seen in many modern websites.

Many thanks for watching.

Conor

[deepak]

I have been looking for this all over youtube thanks for sharing!!

[danielmosca]

great! thank you!!
how could I do if I'd add a blur effect?

[aleksejsskurjats]

Thanks man for sharing your knowledge! 🚀💥

[kelligart]

Another great tutorial, thanks Conor !

[WorshipMinistryTraining]

Can I make it one word at a time, instead of one character at a time?

[howuseehim]

What is your theme ? Thanks for the tuts very useful stuff as usual

[ggwp]

So u can now do this only using CSS.
Use animation timeline view

[MatteoMastrototaro-qo]

Thank you so much for this tutorial, such a great animation. But I'm having trouble because it slows my website a lot, it seems like lagging when reach the point with the animated paragraph. Do you have any suggestions to make it lighter?

EDIT: I solved the problem by splitting paragraphs by words and not by a single character. Much lighter!
To do that just change
→ let pArray =
to this
→ let pArray = paragraph.textContent.split(' ');
And I added padding-right to span style, to simulate blank spaces between words.

Hope this will be useful to someone stuck in the same situation I was.

[guru-xnyp]

thanks a lot man! what's that vscode theme btw?

[tomsgxdv]

thank you for this great work!
Can you help me, I'm having trouble changing the opacity of the text lower in the screen (top position about 50%) because it causes reading problems. (I don't know what values to change)
THANK YOU

[Uncaught_in_promise]

what about mobile devices? does it work on mobile?

[bewise]

is there any code link
my this code is not working

[hail]

Can you create a tutorial on webgl image hover effects without using plugins?