Gradient Rainbow Usernames CSS

Hello i am the owner of Elemental Hero University found at http://www.eherouniverisity.com/

I am wondering if it is possible to apply a gradient Rainbow Text shadow to usernames. For example: http://prntscr.com/2i891z but wiht more colors such as yellow purple and green as well as red and blue.

If it is possible may i obtain the proper code for it?


Thank you ahead of time.

Hello i think this is what you are looking for http://www.avacweb.com/t403-multi-colored-usernames?highlight=usernames

None of those codes seems to be working. I tried it on one of my members and it did nothing.

Bump. I still need help with this.

Still needing help with this. Can anybody help me?

Did you try this code?

Code:

        a[href="/usernumber"] span{color:#F00;animation:svcolor 1s infinite;-moz-animation:svcolor 1s infinite;-webkit-animation:svcolor 1s infinite;}
            @keyframes svcolor{10%{color:#F00}20%{color:#F80}30%{color:#FF0}40%{color:#5F0}50%{color:#0F0}60%{color:#0FD}70%{color:#09F}80%{color:#00F}90%{color:#A0F}100%{color:#F0F}}
            @-moz-keyframes svcolor{10%{color:#F00}20%{color:#F80}30%{color:#FF0}40%{color:#5F0}50%{color:#0F0}60%{color:#0FD}70%{color:#09F}80%{color:#00F}90%{color:#A0F}100%{color:#F0F}}
            @-webkit-keyframes svcolor{10%{color:#F00}20%{color:#F80}30%{color:#FF0}40%{color:#5F0}50%{color:#0F0}60%{color:#0FD}70%{color:#09F}80%{color:#00F}90%{color:#A0F}100%{color:#F0F}}

Yes i copied it as is and it didn't work. I tried it on my name and nothing happened

Unfortunately the CSS stylesheet in the administration panel does not seem to support the CSS3 animations. It would instead have to be appended to the document head as an inline stylesheet.

EDIT :
Sorry I had forgotten to include the script

Administration Panel > Modules > Javascript codes management > Create a new script

Title : what you wish
Placement : in all the pages
Paste the code below and submit :

Code:

jQuery(function() {
/* create our style element */
var sheet = document.createElement('STYLE');

/* content for our style element */
sheet.innerHTML =
'a[href="/u1"] span {'+
'color:#F00;'+
'animation:svcolor 1s infinite;'+
'-moz-animation:svcolor 1s infinite;'+
'-webkit-animation:svcolor 1s infinite;}'+
'@keyframes svcolor {'+
'10%{color:#F00}'+
'20%{color:#F80}'+
'30%{color:#FF0}'+
'40%{color:#5F0}'+
'50%{color:#0F0}'+
'60%{color:#0FD}'+
'70%{color:#09F}'+
'80%{color:#00F}'+
'90%{color:#A0F}'+
'100%{color:#F0F}}'+
'@-moz-keyframes svcolor {'+
'10%{color:#F00}'+
'20%{color:#F80}'+
'30%{color:#FF0}'+
'40%{color:#5F0}'+
'50%{color:#0F0}'+
'60%{color:#0FD}'+
'70%{color:#09F}'+
'80%{color:#00F}'+
'90%{color:#A0F}'+
'100%{color:#F0F}}'+
'@-webkit-keyframes svcolor {'+
'10%{color:#F00}'+
'20%{color:#F80}'+
'30%{color:#FF0}'+
'40%{color:#5F0}'+
'50%{color:#0F0}'+
'60%{color:#0FD}'+
'70%{color:#09F}'+
'80%{color:#00F}'+
'90%{color:#A0F}'+
'100%{color:#F0F}}';

/* append the style element to the head */
document.getElementsByTagName('HEAD')[0].appendChild(sheet);
});