Animated Rainbow Usernames

[Crayo]

Not sure why anyone would want this to work, it screams unprofessional.

[Vernier]

Works great! Thanks!

~ David

[User 2877]

CSS 3 and HTML 5 should have a way for rainbow text other than javascript. That's my opinion.

[Trickshot]

This works but colors could be a bit more sharp.

[Eric]

CSS 3 and HTML 5 should have a way for rainbow text other than javascript. That's my opinion.

Don't know about text but you can do it with an image.

img {  
   -webkit-animation: adjustHue 1s alternate infinite;  
}  
      
@-webkit-keyframes adjustHue {  
   0% { -webkit-filter: hue-rotate(30deg); }  
   50% { -webkit-filter: hue-rotate(60deg); }  
   100% { -webkit-filter: hue-rotate(90deg); }  
}  

Doesn't work in any browsers but webkit atm though.

[effone]

Working fine. Thank you.

[Seanfromleeds]

Not working for me says:

The following errors were encountered:

You can't use script, meta or base tags in the username style.

[pcfreak30]

Hello. I personally found this code to be horribly written.

I have written a jQuery plugin to accomplish this. I don't care to explain the settings but you can look at the "options" object to see what is supported.

This will only handle 1 element at a time. An example of how I used it is this:

	(function ($) {
		$(function () {
$(".rainbowText").each(function(i, b){$(b).rainbowText()});
		}

		);

	})(jQuery);

I just put a span tag with a class of "rainbowText" in the group username display and put the above JS in the js script and inserted in "headerinclude". Some reason the JS was triggering a security error in the template editor.

To get the plugin go here:https://www.github.com/pcfreak30/jquery-rainbowtext

Peace..

[Ariana]

CSS 3 and HTML 5 should have a way for rainbow text other than javascript. That's my opinion.

.rainbow {
  background-image:-webkit-gradient( linear, left top, right top, color-stop(0, #f22), color-stop(0.15, #f2f), color-stop(0.3, #22f), color-stop(0.45, #2ff), color-stop(0.6, #2f2),color-stop(0.75, #2f2), color-stop(0.9, #ff2), color-stop(1, #f22) );
  color:transparent;
  -webkit-background-clip: text;
}

That's what I'd use, having it animated would be annoying

[cappazushi]

I doubt I would use this myself, but I'm sure there are lots of people out their, for better or worse, that want this for their forums (which I know because I read the Showcase a lot). However, anyone that implements it should remove the animation. It will really kill the forum's readability and professionalism.