Version 1:
Simple HTML Dropdown/Multiselect List.
code for the header.html
<script type="text/JavaScript">
<!--
function jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0;
}
//-->
</script>
<style type="text/css">
<!--
.whosonline{ font-size: 9px; width:100%; border:1px black solid; color:#000000; margin:1px; }
-->
</style>
code for the session.php
search:
while ($row = $site_db->fetch_array($result)) {
replace with:
$user_online_list .= "<form name=\"whosonline\"><select name=\"whosonline\" size=\"3\" onchange=\"jumpMenu('parent',this,0)\" class=\"whosonline\">";
while ($row = $site_db->fetch_array($result)) {
if you remove the size it will show as a Dropdown!
search:
$user_profile_link = (!empty($url_show_profile)) ? preg_replace("/{user_id}/", $row['session_user_id'], $url_show_profile) : ROOT_PATH."member.php?action=showprofile&".URL_USER_ID."=".$row['session_user_id'];
$user_online_list .= "<a href=\"".$site_sess->url($user_profile_link)."\">".$username."</a>".$invisibleuser;
replace with:
$user_profile_link = (!empty($url_show_profile)) ? preg_replace("/{user_id}/", $row['session_user_id'], $url_show_profile) : ROOT_PATH."member.php?action=showprofile&;".URL_USER_ID."=".$row['session_user_id'];
$user_online_list .= "<option value=\"".$site_sess->url($user_profile_link)."\">".$username."".$invisibleuser."</option>";
search:
$num_total_online = $num_registered_online + $num_guests_online;
replace with:
$user_online_list .= "</select></form>";
$num_total_online = $num_registered_online + $num_guests_online;
Version 2:
Advance List with Smilies or another Images in front of the Username.
code for the header.html
<script type="text/JavaScript">
<!--
function init_listbox_checkbox(el)
{
el.runtimeStyle.behavior="none";
if(window.navigator.userAgent.indexOf("MSIE 7")>=0){rerutn;};/*IE7 should be compatible with CSS2.0*/
if(el.id=="")
{
el.id = "listbox_label" + el.sourceIndex +Math.ceil (Math.random() * 10000 )
}
el.parentNode.htmlFor = el.id;
el.onpropertychange = function()
{
var span = this.parentNode.all.tags("span")[0];
span.className = this.checked?"checked":"";
}
el.parentNode.onmouseover = function(){this.className="hover";window.event.returnValue=false;window.event.cancelBubble=true;return false;}
el.parentNode.onmouseout = function(){this.className="";window.event.returnValue=false;window.event.cancelBubble=true;return false;}
}
function goToURL() { //v3.0
var i, args=goToURL.arguments; document.returnValue = false;
for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
}
//-->
</script>
<style type="text/css">
<!--
/*Breite festlegen*/
form.whosonline{background:buttonface;width:100%;border:solid 0px #aaaaaa;}
/*Höhe festlegen*/
div.listbox {height:50px;margin:0px;}
/*Zeilenhöhe und Rahmen festlegen*/
div.listbox span{height:20px;padding:3px 3px 3px 3px;white-space:nowrap;display:block;cursor:hand;cursor:pointer;}
/* IE Hintergund&Schrift */
div.listbox label.hover{background-color:#EAEAEA;color:white;}
/* Nestcape Hintergund&Schrift */
div.listbox[id] label:hover{background-color:#EAEAEA;color:white;}
/*generic rules*/
div.listbox{background:white; font-size:12px; padding:0; list-style:none; overflow:auto; border:solid 1px #666666; scrollbar-face-color:#cccccc; scrollbar-highlight-color: #eeeeee; scrollbar-shadow-color: buttonface; scrollbar-3dlight-color: #aaaaaa; scrollbar-arrow-color: #ffffff; scrollbar-track-color: #eeeeee; scrollbar-darkshadow-color: #aaaaaa; }
div.listbox label input{float:left;}
div.listbox label{display:block;clear:both;}
/*For CSS3 ompatible browsers (ie:FireFox) */
div.listbox label input:not([Hedger]){display:none;_display:block;_float:left;_width:0;behavior:expression(void(init_listbox_checkbox(this)));}
div.listbox span:not([Hedger]){padding-left:22px;background:url({template_image_url}/user_online.png) left center no-repeat;border:solid 1px white;border-bottom-color:#f0f0f0;border-left:solid 0px #dedede;}
/*for IE*/
* html div.listbox label input{display:block;float:left;width:0;behavior:expression(void(init_listbox_checkbox(this)));}
* html div.listbox span{padding-left:22px;background:url({template_image_url}/user_online.png) left center no-repeat;border:solid 1px white;border-bottom-color:#f0f0f0;border-left:solid 0px #dedede;}
-->
</style>
You must change the Path to the images in the CSS Part to your own! (two times!) Also you can change the Layout in the CSS Part
search:
$result = $site_db->query($sql);
replace with:
$result = $site_db->query($sql);
$user_online_list .= "<form class=\"whosonline\"><div class=\"listbox\" id=\"foo\">";
$i="";
search:
if (!$is_invisible || $user_info['user_level'] == ADMIN) {
$user_online_list .= ($user_online_list != "") ? ", " : "";
$user_profile_link = (!empty($url_show_profile)) ? preg_replace("/{user_id}/", $row['session_user_id'], $url_show_profile) : ROOT_PATH."member.php?action=showprofile&".URL_USER_ID."=".$row['session_user_id'];
$user_online_list .= "<a href=\"".$site_sess->url($user_profile_link)."\">".$username."</a>".$invisibleuser;
}
replace with:
if (!$is_invisible || $user_info['user_level'] == ADMIN) {
$i++;
$user_profile_link = (!empty($url_show_profile)) ? preg_replace("/{user_id}/", $row['session_user_id'], $url_show_profile) : ROOT_PATH."member.php?action=showprofile&".URL_USER_ID."=".$row['session_user_id'];
$user_online_list .= "<label><input type=\"radio\" name=\"ck[]\" value=\"".$i."\" onClick=\"goToURL('parent','".$site_sess->url($user_profile_link)."');return document.MM_returnValue\" /><span>".$username."</span> </label>";
}
search:
$num_total_online = $num_registered_online + $num_guests_online;
replace with:
$user_online_list .= "</select></form>";
$num_total_online = $num_registered_online + $num_guests_online;
I give no CSS/JavaScript Support for this Mod!
And i have tested it only with 1.7.1....
Don´t ask for a Demo try it out, i will go to sleep yet... (o:
And remember you must only install one and not both Versions!
Enjoy...