The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

How to change this code?

View previous topic View next topic Go down

Solved How to change this code?

Post by jarn on October 6th 2014, 8:04 pm

Code:
a span[style="color:#990099"] strong:hover:after {
  content:"Moderator";
  font-size:10px;
  color:#000;
  background:#FFF;
  border:1px solid #EEE;
  box-shadow:1px 1px 2px #000;
  border-radius:4px;
  padding:3px;
  position:absolute;
  bottom:5px;
  right:0px;
  display:inline-block;
  white-space:nowrap;
  z-index:1;
  margin:-25px;
}
a span[style="color:#990099"] strong { position:relative }

How do I change this code so that rather than groups, it can be used for individual users?

jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: How to change this code?

Post by Soul on October 6th 2014, 8:21 pm

Hello jarn,
Try adding this code to your CSS. Just be sure to change the "#" in the "u#" to the user number. You can find this number by clicking their profile and you can see it after your domain there should be a "/u#" and just copy that number and replace the "#" in the code and click save. If this doesn't work, let me know so I can make some adjustments!


Code:
a[href="u#"] strong:hover:after {
  content:"Moderator";
  font-size:10px;
  color:#000;
  background:#FFF;
  border:1px solid #EEE;
  box-shadow:1px 1px 2px #000;
  border-radius:4px;
  padding:3px;
  position:absolute;
  bottom:5px;
  right:0px;
  display:inline-block;
  white-space:nowrap;
  z-index:1;
  margin:-25px;
}
a span[style="color:#990099"] strong { position:relative }


Hope this helps!


-Jad

Soul
Forumember

Male Posts : 673
Reputation : 79
Language : English
Location : United States

http://adminvortex.forumotion.com

Back to top Go down

Solved Re: How to change this code?

Post by jarn on October 7th 2014, 8:16 pm

Nothing happened, unfortunately.

jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: How to change this code?

Post by SLGray on October 7th 2014, 8:28 pm

Did you change the u# part?


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36697
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: How to change this code?

Post by jarn on October 7th 2014, 8:58 pm

Yes.

jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: How to change this code?

Post by Soul on October 7th 2014, 9:06 pm

@jarn wrote:Yes.
Hello Jarn,
Could you please provide us the code that you used so we can see if something went wrong with the code I provided you?

-Jad

Soul
Forumember

Male Posts : 673
Reputation : 79
Language : English
Location : United States

http://adminvortex.forumotion.com

Back to top Go down

Solved Re: How to change this code?

Post by Ramdaman on October 7th 2014, 9:11 pm

Also, you didn't remove the "u" did you? Only replace the "#"

Ramdaman
Active Poster

Male Posts : 1614
Reputation : 97
Language : English, Albanian, Macedonian, Russian | HTML, CSS
Location : New York City

http://ndihme.forumotion.com/forum

Back to top Go down

Solved Re: How to change this code?

Post by jarn on October 7th 2014, 9:40 pm

Code:
a[href="u1"] strong:hover:after {
  content:"HEAD ADMIN";
  font-size:10px;
  color:#000;
  background:#FFF;
  border:1px solid #EEE;
  box-shadow:1px 1px 2px #000;
  border-radius:4px;
  padding:3px;
  position:absolute;
  bottom:5px;
  right:0px;
  display:inline-block;
  white-space:nowrap;
  z-index:1;
  margin:-25px;
}
a span[style="color:#006E8A"] strong { position:relative }

jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: How to change this code?

Post by Ange Tuteur on October 7th 2014, 10:03 pm

Jadster, you forgot to modify the last Rule's selector :
Code:
a span[style="color:#006E8A"] strong { position:relative }

I'll place it at the top so it's easier to find :

You can add it to your sheet too, jarn.
Code:
a[href="/u1"] span strong { position:relative }
a[href="/u1"] span strong:hover:after {
  content:"HEAD ADMIN";
  font-size:10px;
  color:#000;
  background:#FFF;
  border:1px solid #EEE;
  box-shadow:1px 1px 2px #000;
  border-radius:4px;
  padding:3px;
  position:absolute;
  bottom:5px;
  right:0px;
  display:inline-block;
  white-space:nowrap;
  z-index:1;
  margin:-25px;
}

That rule helps keep the caption, or "tooltip" bound to the username. If the name is not Relative the tooltip will go to the edge of the screen.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: How to change this code?

Post by Soul on October 7th 2014, 10:18 pm

Oh ok! Thank you so much Ange! I completely missed over that.

-Jad

Soul
Forumember

Male Posts : 673
Reputation : 79
Language : English
Location : United States

http://adminvortex.forumotion.com

Back to top Go down

Solved Re: How to change this code?

Post by jarn on October 7th 2014, 11:52 pm

Thanks, it works now!

jarn
Forumember

Posts : 80
Reputation : 1
Language : English

http://cwentertainment.forummotion.com/

Back to top Go down

Solved Re: How to change this code?

Post by Base on October 8th 2014, 12:17 am

Solved => Archived

Base
Forumaster

Male Posts : 10386
Reputation : 1687
Language : English and French
Location : United Kingdom, England

http://forumotionhub.net

Back to top Go down

View previous topic View next topic Back to top


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