Welcome Guest [Log In] [Register]
Viewing Single Post From: Hover Member Legend
Mwr247 Nov 27 2007, 09:25 PM
Member Avatar
Cæsaris Salutis!
[ * * ]
 Name:
Hover Member Legend (By Mwr247)

Description:
An IF to ZB conversion. Want to add more style to your member legend? Want to have it list all the member groups instead of just those that are online? Then try this out.

Once added, the user legend will display colored pips for each of your groups in your user legend. Hovering over each one will cause the "Member Legend" text to change into the name of the group. Clicking a box will search for everyone in that group in the member list.

Unlike most older user legends from IF that require you to make, upload, and load image boxes for every color, this actually does it for you using blocks of text, allowing for simple use and easy installation. Basically automatic pips of any color you can imagine!

Browser compatibility:
Tested to work in IE, FireFox, Mozilla, Opera, and Safari.

Preview:
ZetaBox
Check the Board Statistics.

Installation:
Goes in your board template "Below the Board" area:
Quote:
 
<script type="text/javascript">
// Hover Member Legend (By Mwr247)

// Add Groups (Title, Color, Group_Number)
n=0;
var addgroup=[];
addgroup[n++]=['Admin','red','4'];
addgroup[n++]=['Moderator','blue','6'];
addgroup[n++]=['Member','green','3'];
addgroup[n++]=['Validating','black','1'];
addgroup[n++]=['<s>Banned</s>','purple','5'];
</script>
<script name="Z.H.M.L." src="http://209.85.62.24/1/22/0/p130/zetalegend.ibf"></script>

The text in red is the title of the group that appears when you hover over the block. To add effects such as a strikethrough or bold or underline, just put the tags around it like in the banned example.

The text in blue the color of the group. This color will effect the block and the group title text. You can use words (red) or hex codes (#FF0000).

The text in green is the group number. To find that, just hover your mouse over the group link in the old user legend for the group you want, and look at the number at the end of the link. That is the group number.

If you want to add more groups, just copy the last "addgroup" line and paste it below it.

And that's it! Your super amazing hover user legend is installed! Enjoy :D

Extras:
Here are some optional addons for your code.

Add this to the CSS to remove the default Zetaboards member legend:
Code:
 
<style>#stats_legend{ display: none; }</style>


This code replaces the default user legend with IF styled online member sorting links (preview on test board, add after main javascript code):
Code:
 
<script type="text/javascript">
<!--
var adl=document.getElementById('stats_legend');
if(adl){adl.innerHTML='Show detailed list by: <a href="'+main_url+'online/?sort=t">Last Click</a>, <a href="'+main_url+'online/?sort=n">Member Name</a>';}
// -->
</script>
Edited by Mwr247, Feb 3 2008, 04:13 PM.
Offline Profile Quote Post
Hover Member Legend · User Created Codes