usergroup legend hover

[Dr.CustUmz]

so i want to make a usergroup legend that shows users from hovered usergroup only.

similar to the mod
https://vborg.vbsupport.ru/showthread.php?t=140019&highlight=Mouseover

but not just showing the usergroup name, i want it to show users online from that usergroup.

so I'm just curious before i start this, does anything like that already exist (yes i have searched)

and if not... what would be the conditional for that sort of thing

something similar to this im guessing... but only to show the users from hovered usergroup not only show specified usergroup (confusing but makes since to me lol)
<if condition="is_member_of($vbulletin->userinfo, 6)"></if>

EXP: (quick ps mockup)
https://vborg.vbsupport.ru/attachment.php?attachmentid=149008&stc=1&d=1399139399

[Dr.CustUmz]

bump -
back in the scene and could use some help with this still

[TheLastSuperman]

So you want to know if a mod already exist that; When you hover over a members usergroup title in posts, it will show a popup box with an entire list of the members within said group?

If that is the case, it might not be best to do this... perhaps but if you realize why it's best to not show all usergroups members from all usergroups on the memberlist then you'd realize why that is unless it queries the members on click i.e. at time of request instead of loading for that div area each page load. I dunno I'm split on this, if you should be doing this based on what I know and if it can be done differently... perhaps someone else will come along with some suggestions or info I'm just not considering now so stand by ;).

Edit: But to answer your question, no I haven't seen anything similar to this but there's so many mods out there I don't know them all, 90% sure but the other 10% is still new to me :p.

[Dr.CustUmz]

no, i want to create a product (a legend) that is in the users online section on forumhome.

when user hovers over the title for the usergroup, it will pop up users that are online in the group they are hovering over, if that makes sence.

poor example: (UNHOVERED - similar to normal way)

ONLINE USERS:
admin, mod, user1, user2, user3

MEMBER - MOD - ADMIN - SPIDER - SUPER - SPECIAL

poor example 2: (hovering over members in the legend)

ONLINE USERS:
user1, user2, user3

MEMBER - MOD - ADMIN - SPIDER - SUPER - SPECIAL

[Dave]

I think I know what you mean... it shouldn't be too hard to make such thing.
What you need to implement first is a way to see what member belongs to what usergroup.

You can do this by giving the hyperlink another attribute such as usergroup="6" or usergroup="administrator" and then when someone hovers over the legend rank administrator (which also has some kind of attribute attached to it so you can see what usergroup is being hovered over), it will loop through each of the hyperlinks in the "Who's online" div and find who has the attribute.

I made a quick example for you here: https://jsfiddle.net/1n5zzof6/

[Dr.CustUmz]

thats perfect dave, exactly what im going for and i didnt think of giving them an additional tag that included their usergroup -_- didnt think it was that simple =)

some reason i cant get this working i had it semi working when i had it all in forumhome_loggedinusers template that causes it to repeat though cause it prints that template for each user, but when i add it properly

FORUMHOME:
<div class="usersonline">$activeusers</div>
<div class="legend">
<span usergroup="6">Administrator</span> <span usergroup="2">Member</span>
</div>

FORUMHOME_LOGGEDINUSER:
<if condition="$show['comma_leader']">, </if>$stylevar[dirmark]<a usergroup="$loggedin[usergroupid]" href="member.php?$session[sessionurl]u=$loggedin[userid]">$loggedin[musername]</a>$loggedin[invisiblemark]$loggedin[buddymark]

HEADER:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
$(".legend span").hover(function(){
usergroup = $(this).attr('usergroup');
$(".usersonline a").each(function(){
if($(this).attr('usergroup') != usergroup){
$(this).hide();
}
});
}, function(){
$(".usersonline a").show();
});
</script>

its not working... i have no errors in the console... and the html generates perfect... am i missing something...

HTML OUTPUT:
<div class="usersonline"><!-- BEGIN TEMPLATE: forumhome_loggedinuser -->
<a usergroup="6" href="http://dirtrif.com/members/drcustumz.html">DrCustUmz</a>
<!-- END TEMPLATE: forumhome_loggedinuser --><!-- BEGIN TEMPLATE: forumhome_loggedinuser -->
, <a usergroup="2" href="http://dirtrif.com/members/drbot.html">DrBot</a>
<!-- END TEMPLATE: forumhome_loggedinuser --></div>
<div class="legend">
<span usergroup="6">Administrator</span> <span usergroup="2">Member</span>
</div>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
$(".legend span").hover(function(){
usergroup = $(this).attr('usergroup');
$(".usersonline a").each(function(){
if($(this).attr('usergroup') != usergroup){
$(this).hide();
}
});
}, function(){
$(".usersonline a").show();
});
</script>



FIXED BY PLACING SCRIPT IN HEADER
now need to get rid of the commas if theyre not needed....