Live data from Hacker News

Finally, CSS based gradient text, no images

labs.dragoninteractive.com

21–27 of 27 posts

Re: Finally, CSS based gradient text, no images

#23

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.

Re: Finally, CSS based gradient text, no images

#24
post #8

Earlier quoted context omitted.

Looks good, but I also experienced unbearable sluggishness on Linux/Firefox when scrolling. Specifically, Xorg and firefox processes use nearly all my CPU when I scroll. It's unusable in its current form (at least on this system). Hopefully you can tune your code; this is a neat effect.

Unusable for me on Linux/firefox too.

There seems to be something really slow about javascript-heavy sites on Unix, I think.

I'm really curious what the underlying cause is, if it's not just perception bias on my part.

Re: Finally, CSS based gradient text, no images

#25
post #8

Earlier quoted context omitted.

Unusable for me on Linux/firefox too.

There seems to be something really slow about javascript-heavy sites on Unix, I think. I'm really curious what the underlying cause is, if it's not just perception bias on my part.

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.

Re: Finally, CSS based gradient text, no images

#26
post #11

This uses JavaScript, not CSS. CSS on the other hand, does have a built-in way to do gradients (CSS3+): *-colors: #color1 #color2 #color3 #color4 ect For example, this demo makes use of border-colors gradients and border-radius: http://code.eligrey.com/css3/border-colors/styled.html (Only shows gradient in browsers that support CSS3 like FF3 & Safari 3)

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.
Post reply on HN