Contrary to popular opinion, assisstive technology for the visually disabled piggybacks onto existing browsers and so gains the full benefits of Javascript. If you’re going to clone your text 52 times over, then your text will be read out 52 times by the browser. Oops.
This works by duplicating the text, one copy for each pixel of height. The text is then clipped with overflow: hidden. The sluggishness on that page results from a couple hundred (thousand?) copies of the text positioned absolutely and needing to be clipped.
Interesting technique, but it does use JavaScript (but degrades nicely).
A couple of side-effects: Firefox 3.0.8 is pretty sluggish when scrolling (although it might be better with only one instance of this used), also you can't (visibly) select the text that has this applied to it.
Possibly, since I don't use anything else I don't know (except in a virtual machine). I get the impression however that the firefox people spend a lot of time optimizing for MacOS and Windows that they don't spend on Linux for some reason.
Finally? Forgive me, but I can't really see the need for CSS to pull this off on its own. With gradient text you're not looking to convey information (or at least, no more than the words would convey with any other css-available text effect), you're looking for a visual effect. Something that images handle rather well.
Or if you're looking for something that scales nicely with screen resolution or whatnot, SVGs. I'm really looking forward to vector graphics getting better support in browsers - half the time we used bitmap images we really mean something else.
While that’s really neat (and something I didn’t know about) it’s not something that makes an appearance in either the CSS3 Colors or Backgrounds & Borders specs. Call it a vendor specific CSS extension rather than CSS3 for the time being.
I can appreciate the desire to have simple, CSS based solutions for somewhat common requests -- though I would not consider gradient text a common request, just work with me here -- solving the issue by coming up with some elaborate solution that is generally reserved for crazy positioning problems to work with IE5+ and modern browsers simultaneously is hardly a good approach.
what a terrible solution to a non-existent problem. This doesn't even work as a proof of concept - I can't think of a single scenario where this technique would be useful.
Contrary to popular opinion, assisstive technology for the visually disabled piggybacks onto existing browsers and so gains the full benefits of Javascript. If you’re going to clone your text 52 times over, then your text will be read out 52 times by the browser. Oops.