MyBB Community Forums

http://cloudin728.com/forums/forum.php
I like how they have the flashy owner usergroup name. I know about background images and such, but the owner said it's not a background image, it's something about the text. He uses Vbulletin. Is there some way to do this on mybb??

Actually, if you take a look at the source, it is a background image.

CSS

.developer {
    background: url("http://resources.guild-hosting.net/1024/themes/core/images/tag_fx/fire_white.gif") repeat scroll 0 0 rgba(0, 0, 0, 0);
    color: #FFFFFF;
    font-family: Museo;
    font-weight: bold;
    text-shadow: 0 0 5px #CC0000, 0 0 6px #CC0000, 0 0 7px #CC0000;
}

HTML

<a href="member.php?u=277">
	<img src="http://cloudin728.com/images/devicon.png">
	<span class="developer">Spiritwo</span>
</a>

Not his, though I do like his. I meant the owner's one. Thanks for the help, this will help.

Woops, you are correct.

And he is not using an image, its an animation. But be careful, its not supported in I9 and earlier.

.owner {
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-name: bounce_owner;
    color: #FFFFFF;
    font-family: Museo;
    font-weight: bold;
    line-height: 1em;
    text-shadow: 0 0 10px #FF00DE;
}

So i put this in the global css, and then do <span class="owner"> on the usergroup thing?

You would put that in the global CSS, then go to:

AdminCP>Users and Groups>Groups>"the group you want"

And under "Username Style" add:

<span class="owner">{username}</span>

That works, but it doesn't play the animation. It just makes it the color.

What browser are you using?

I'm using Google chrome. Linux.

---

I tried it on my windows comp and it still didn't work. Firefox on that one

This should fix it.

.owner {
    -webkit-animation-duration: 1s;
	-moz-animation-duration: 1s;
	-o-animation-duration: 1s;
	animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
	-moz-animation-iteration-count: infinite;
	-o-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
    -webkit-animation-name: bounce_owner;
    -moz-animation-name: bounce_owner;
	-o-animation-name: bounce_owner;
	animation-name: bounce_owner;
    color: #FFFFFF;
    font-family: Museo;
    font-weight: bold;
    line-height: 1em;
    text-shadow: 0 0 10px #FF00DE;
}