The Problems
It creates duplicates of every character layered atop each-other with absolute positioning and overflow:hidden to clip off the parts. Ttthhhiiisss rrreeesssuuullltttsss iiinnn nnnooonnn — -vvviiisssuuuaaalll uuussseeerrr aaagggeeennntttsss rrreeeaaadddiiinnnggg yyyooouuurrr ttteeexxxttt llliiikkkeee ttthhhiiisss…Not exactly a desirable behavior.
For top to bottom shading of that type, we don’t actually need JavaScript’s help! Quite literally just set a linear gradient top to bottom and then set background-clip:text; (and its -webkit equivalent)
Not only is the scripting many times larger than need be because of this, it’s the typical poorly written schlock one can expect from the train wreck laundry list of how NOT to write JavaScript that is jQuery. It was derpy incompetent trash when it was introduced 15 years ago, it’s mind-numbingly dumbass garbage as of 2021. How that smelly brainfart ever became popular escapes me.

#html #web-development #javascript #web-design #css

CSS Character Styling Using Background-Clip
1.15 GEEK