The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Multi-Colored Usernames in chatbox

2 posters

Go down

Solved Multi-Colored Usernames in chatbox

Post by gunsmaker January 21st 2015, 2:25 pm

i've readed and searched on the archive for this multi colored usernames, and i found it but it doesnt apply at chatbox, my thought is because its used js.
Code:
$(function(){
  multiColor(1, '<strong><font color="#ff0000">Mid</font><font color="#ffff00">night</font> <font color="#0000ff">Bunny</font>');
  
  function multiColor(id, html){$('a[href="/u'+id+'"] strong').not(function(){return $("img",this)[0]}).html(html)}
});

why i thought that? because i've used glitter and glow in css, 
Code:
a[href="/u1"] { background:url('http://i58.servimg.com/u/f58/15/62/32/35/backro13.gif'); }
a[href="/u1"] { text-shadow: 0px 2px 6px #ff00ff; }
a[href="/g1-admins"] { background:url('http://i58.servimg.com/u/f58/15/62/32/35/backro13.gif'); }
a[href="/g1-admins"] { text-shadow: 0px 2px 6px #ff00ff; }
and this glitter and glow are applied in chatbox.
Multi-Colored Usernames in chatbox ASCJTC9

i've tried the css and js codes that i found in archive here , here , and others (i forgot to bookmark it).

Please help.
my forum is using phpbb3.
avatar
gunsmaker
Forumember

Posts : 34
Reputation : 1
Language : English and Indonesian

http://tcga.forumn.org

Back to top Go down

Solved Re: Multi-Colored Usernames in chatbox

Post by Ange Tuteur January 21st 2015, 6:48 pm

Hello @gunsmaker,

The problem is that the javascripts you install on the forum do not affect the chatbox. You'd need to access the frame and constantly reapply the style every time the chatbox refreshes; in short it can be a bit heavy and buggy. I do however, have a solution using CSS3 to make a multi-colored username, but it can only be two tones, if you want it. Wink
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Multi-Colored Usernames in chatbox

Post by gunsmaker January 21st 2015, 7:15 pm

Ange Tuteur wrote:I do however, have a solution using CSS3 to make a multi-colored username, but it can only be two tones, if you want it. Wink

2 tones is ok, as long its affecting the chatbox.
avatar
gunsmaker
Forumember

Posts : 34
Reputation : 1
Language : English and Indonesian

http://tcga.forumn.org

Back to top Go down

Solved Re: Multi-Colored Usernames in chatbox

Post by Ange Tuteur January 21st 2015, 7:38 pm

Here, add this to your stylesheet :
Display > Colors > CSS stylesheet
Code:
a[href="/u1"] span strong { font-size:0 }
a[href="/u1"] span strong:before {
  font-size:10px;
  content:"Ange ";
  color:#00A5CD;
}
a[href="/u1"] span strong:after {
  font-size:10px;
  content:"Tuteur";
  color:#7CBA2C;
}
#chatbox_members li a[href="/u1"] span:first-child strong:before { content:"@" }
#chatbox_members li a[href="/u1"] span:first-child strong:after { content:"" }

There's some things you should change :

a[href="/u1"] : make sure to change the 1 in /u1 to the ID of your profile.

You'll see content:"Ange "; and content:"Tuteur"; those are the beginning and ending texts. After those are the colors they will be.

At the end of the code is a small fix for the mod icon. It will have a different color depending which rule the @ is in.
Code:
#chatbox_members li a[href="/u1"] span:first-child strong:before { content:"@" }
#chatbox_members li a[href="/u1"] span:first-child strong:after { content:"" }
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Multi-Colored Usernames in chatbox

Post by gunsmaker January 22nd 2015, 4:20 am

it works, thanks.
Multi-Colored Usernames in chatbox Z5ow4lY

but as you see, the "@" still has different color, it will be good if the "@" at right matching the left color, or maybe the "@" color at left maching the right color.
avatar
gunsmaker
Forumember

Posts : 34
Reputation : 1
Language : English and Indonesian

http://tcga.forumn.org

Back to top Go down

Solved Re: Multi-Colored Usernames in chatbox

Post by Ange Tuteur January 22nd 2015, 4:33 am

Considering that the @ on the right isn't wrapped by an anchor with your ID, your best choice would be to set it to the default color.
Code:
#chatbox_members li a[href="/u1"] span:first-child strong:before {
  content:"@";
  color:#000;
}
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Multi-Colored Usernames in chatbox

Post by gunsmaker January 22nd 2015, 4:54 am

Multi-Colored Usernames in chatbox CC92TKb
as you see its glow and glitter is not sync.
is there a code to hide the "@" at the left and right?
avatar
gunsmaker
Forumember

Posts : 34
Reputation : 1
Language : English and Indonesian

http://tcga.forumn.org

Back to top Go down

Solved Re: Multi-Colored Usernames in chatbox

Post by Ange Tuteur January 22nd 2015, 5:02 am

This should remove the glow on the @ :
Code:
#chatbox_members li a[href="/u1"] span:first-child strong:before {
  content:"@";
  color:#000;
  text-shadow:none;
}

To hide it on the left, you can just delete the @ from content. To hide it on the right, add this to your CSS :
Code:
.user-msg .user > span[style="color:#000000"] { display:none }
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Multi-Colored Usernames in chatbox

Post by gunsmaker January 22nd 2015, 5:08 am

i've decided to remove the glitter, and now it looks like this.
Multi-Colored Usernames in chatbox S2wqLPX

Thankyou very much @Ange Tuteur, Smile

-Solved-
avatar
gunsmaker
Forumember

Posts : 34
Reputation : 1
Language : English and Indonesian

http://tcga.forumn.org

Back to top Go down

Solved Re: Multi-Colored Usernames in chatbox

Post by Ange Tuteur January 22nd 2015, 5:43 am

You're welcome ! Mr. Green

Topic archived
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum