[AJAX] - Slide Panel (F1)
Mod Version: 1.00, by apdcanari
This modification is in the archives.
| vB Version: 3.7.0 RC 1 | Rating:  (4 votes - 5.00 average) |
Installs: 41 |
| Released: 24 Mar 2008 | Last Update: Never | Downloads: 223 |
 Not Supported
 Template Edits
|
||
Hello,
I speak French...
1. Upload the js file in clientscript : forumroot/clientscript/slidepanel.js
2. Add to CSS
3. Add to template HEADINCLUDE
4. Add to template HEADER
5. After if you want a link in your template, you can add this :
Touch F1 in your keayboard, or click the image (top right) 
Source : http://www.dhtmlgoodies.com/
Cédric
I speak French...
1. Upload the js file in clientscript : forumroot/clientscript/slidepanel.js
2. Add to CSS
HTML Code:
#dhtmlgoodies_leftPanel ul{
padding-left:20px;
margin-left:0px;
}
#dhtmlgoodies_leftPanel div{
padding:3px;
}
#mainContent{
width:460px;
background-color:#fff;
padding-right:5px;
border-left:1px solid #000;
border-right:1px solid #000;
border-bottom:1px solid #000;
padding-left:5px;
}
#dhtmlgoodies_leftPanel{
background:#fff;
color:#000;
font-family: Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif;
height:100%;
left:0px;
z-index:10;
position:absolute;
display:none;
overflow:hidden;
}
#dhtmlgoodies_leftPanel #leftPanelContent{
padding:0px;
}
#dhtmlgoodies_leftPanel .closeLink{
padding-left:2px;
padding-right:2px;
background-color:#FFF;
position:absolute;
top:7px;
left:135px;
border:1px solid #000;
color:#000;
font-size:0.8em;
}
#dhtmlgoodies_leftPanel .closeLink:hover{
color:#FFF;
background-color:#000;
}
HTML Code:
<script type="text/javascript" src="clientscript/slidepanel.js"></script>
HTML Code:
<!-- Code for the left panel --> <div id="dhtmlgoodies_leftPanel"> <a class="closeLink" href="#" onclick="initSlideLeftPanel();return false">Fermer</a> <div id="leftPanelContent"> <!-- This is the content --> <div> <!-- table to support left column nav --> <table cellpadding="0" cellspacing="0" border="0" width="100%" align="center"> <tr valign="top"> <td> <!-- usercp nav --> <table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0"> <tr><td class="tcat" nowrap="nowrap"><a href="usercp.php$session[sessionurl_q]"> Tableau de bord</a></td></tr> <tr><td class="thead"><a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('yourcp')"><img id="collapseimg_yourcp" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_yourcp].gif" alt="" border="0" /></a><a href="member.php?$session[sessionurl]u=$bbuserinfo[userid]">Votre profil</a></td></tr> <tbody id="collapseobj_yourcp" style="$vbcollapse[collapseobj_yourcp]"> <tr><td class="$navclass[profile]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"><img border="0" src="$stylevar[imgdir_misc]/usercp_icons/user_edit.gif" width="16" height="16"></td> <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editprofile">Modifier vos informations</a></td> </tr> </table> </td></tr> <tr><td class="$navclass[customize]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/vcard_edit.gif" width="16" height="16"></td> <td> <a class="smallfont" href="profile.php?$session[sessionurl]do=customize">Personnalisation du profil</a></td> </tr> </table> </td></tr> <if condition="$show['profilepiclink']"> <tr><td class="$navclass[profilepic]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/picture_edit.gif" width="16" height="16"></td> <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editprofilepic">Modifier votre portrait</a></td> </tr> </table> </td></tr> </if> </tbody> <tr><td class="thead"><a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('networking')"><img id="collapseimg_networking" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_networking].gif" alt="" border="0" /></a>Réseau</td></tr> <tbody id="collapseobj_networking" style="$vbcollapse[collapseobj_networking]"> <tr><td class="$navclass[buddylist]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/emoticon_smile.gif" width="16" height="16"></td> <td><a class="smallfont" href="profile.php?$session[sessionurl]do=buddylist"><if condition="$show['friends_and_contacts']">$vbphrase[contacts_and_friends]<else />Contacts</if></a></td> </tr> </table> </td></tr> <tr><td class="$navclass[usergroups]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/group.gif" width="16" height="16"></td> <td><a class="smallfont" href="group.php$session[sessionurl_q]">Groupes sociaux</a></td> </tr> </table> </td></tr> <tr><td class="$navclass[usergroups]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/group_add.gif" width="16" height="16"></td> <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editusergroups">Mes groupes</a></td> </tr> </table> </td></tr> <tr><td class="$navclass[album]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/photos.gif" width="16" height="16"></td> <td><a class="smallfont" href="album.php?$session[sessionurl]u=$bbuserinfo[userid]">Images & Albums</a></td> </tr> </table> </td></tr> </tbody> <tr><td class="thead"><a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('settings')"><img id="collapseimg_settings" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_settings].gif" alt="" border="0" /></a>Paramètres et Options</td></tr> <tbody id="collapseobj_settings" style="$vbcollapse[collapseobj_settings]"> <if condition="$show['avatarlink']"> <tr><td class="$navclass[avatar]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/picture_empty.gif" width="16" height="16"></td> <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editavatar">Modifier votre avatar</a></td> </tr> </table> </td></tr> </if> <if condition="$show['siglink']"> <tr><td class="$navclass[signature]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/page_red.gif" width="16" height="16"></td> <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editsignature">Modifier votre signature</a></td> </tr> </table> </td></tr> </if> <tr><td class="$navclass[password]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/lock.gif" width="16" height="16"></td> <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editpassword">Email & Mot de passe</a></td> </tr> </table> </td></tr> <tr><td class="$navclass[options]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/cog.gif" width="16" height="16"></td> <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editoptions">Modifier vos options</a></td> </tr> </table> </td></tr> <tr><td class="$navclass[ignorelist]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/user_delete.gif" width="16" height="16"></td> <td><a class="smallfont" href="profile.php?$session[sessionurl]do=ignorelist">Modifier la liste d'ignorés</a></td> </tr> </table> </td></tr> </tbody> <if condition="$show['pmmainlink']"> <tr> <td class="thead" nowrap="nowrap"> <span id="nav_pmfolders"><a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('pm')"><img id="collapseimg_pm" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_pm].gif" alt="" border="0" /></a>Messages privés</span></td> </tr> <tbody id="collapseobj_pm" style="$vbcollapse[collapseobj_pm]"> <tr><td class="$navclass[pm_messagelist]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/email_open.gif" width="16" height="16"></td> <td colspan="2"><a class="smallfont" href="private.php?$session[sessionurl_q]folderid=0">Boîte de réception</a></td> </tr> <tr> <td width="20"> </td> <td> <img border="0" src="$stylevar[imgdir_misc]/tree_$stylevar[textdirection].gif" /></td> <td><a class="smallfont" href="private.php?$session[sessionurl_q]folderid=-1">Éléments envoyés</a></td> </tr> </table> </td></tr> <if condition="$show['pmsendlink']"> <tr><td class="$navclass[pm_newpm]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/email_add.gif" width="16" height="16"></td> <td><a class="smallfont" href="private.php?$session[sessionurl]do=newpm">Envoyer un message</a></td> </tr> </table> </td></tr> </if> <if condition="$show['pmtracklink']"> <tr><td class="$navclass[pm_trackpm]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/email_go.gif" width="16" height="16"></td> <td><a class="smallfont" href="private.php?$session[sessionurl]do=trackpm">Suivre vos messages</a></td> </tr> </table> </td></tr> </if> <tr><td class="$navclass[pm_editfolders]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/folder_edit.gif" width="16" height="16"></td> <td><a class="smallfont" href="private.php?$session[sessionurl]do=editfolders">Modifier vos dossiers</a></td> </tr> </table> </td></tr> </if> </tbody> <tr> <td class="thead" nowrap="nowrap"> <span id="nav_subsfolders"><a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('subs')"><img id="collapseimg_subs" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_subs].gif" alt="" border="0" /></a>Discussions suivies</span></td> </tr> <tbody id="collapseobj_subs" style="$vbcollapse[collapseobj_subs]"> <tr><td class="$navclass[substhreads_listthreads]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/newspaper.gif" width="16" height="16"></td> <td colspan="2"><a class="smallfont" href="subscription.php?$session[sessionurl]do=viewsubscription">Lister les abonnements</a></td> </tr> <tr> <td width="20"> </td> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/tree_$stylevar[textdirection].gif" /></td> <td><a class="smallfont" href="subscription.php?$session[sessionurl]do=viewsubscription&daysprune=-1&folderid=all">Voir tout</a></td> </tr> </table> </td></tr> <tr><td class="$navclass[substhreads_editfolders]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/folder_edit.gif" width="16" height="16"></td> <td><a class="smallfont" href="subscription.php?$session[sessionurl]do=editfolders">Modifier vos dossiers</a></td> </tr> </table> </td></tr> </tbody> <tr><td class="thead"><a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('misc')"><img id="collapseimg_misc" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_misc].gif" alt="" border="0" /></a>Divers</td></tr> <tbody id="collapseobj_misc" style="$vbcollapse[collapseobj_misc]"> <tr><td class="$navclass[event_reminders]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/time.gif" width="16" height="16"></td> <td><a class="smallfont" href="calendar.php?$session[sessionurl]do=viewreminder">Rappel des événements</a></td> </tr> </table> </td></tr> <if condition="$show['paidsubscriptions']"> <tr><td class="$navclass[paid_subscriptions]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/coins.gif" width="16" height="16"></td> <td><a class="smallfont" href="payments.php$session[sessionurl_q]">Abonnements payants</a></td> </tr> </table> </td></tr> </if> <if condition="$show['attachments']"> <tr><td class="$navclass[attachments]" nowrap="nowrap"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="20"> <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/attach.gif" width="16" height="16"></td> <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editattachments">Pièces jointes</a></td> </tr> </table> </td></tr> <tbody> </if> </table> <!-- / usercp nav --> <if condition="$show['popups']"> <div class="vbmenu_popup" id="nav_subsfolders_menu" style="display:<if condition="$show['popups']">none<else />block</if>"> <table cellpadding="4" cellspacing="1" border="0"> <tr> <td class="thead" nowrap="nowrap">$vbphrase[folders]</td> </tr> $cpnav[subsfolders] </table> </div> </if> <if condition="$show['popups']"> <div class="vbmenu_popup" id="nav_pmfolders_menu" style="display:<if condition="$show['popups']">none<else />block</if>"> <table cellpadding="4" cellspacing="1" border="0"> <tr> <td class="thead" nowrap="nowrap">$vbphrase[folders]</td> </tr> $cpnav[pmfolders] </table> </div> </if> </td> </tr> </table> <!-- / table to support left column nav --> </div> <!-- End content --> </div> </div> <!-- End code for the left panel -->
HTML Code:
<a href="#" onclick="initSlideLeftPanel();return false">Voir le Slide Panel ou appuyez sur F1</a>
Source : http://www.dhtmlgoodies.com/
Cédric
Download
This modification is archived, downloads are still allowed.
slidepanel.zip (2.0 KB, 237 downloads)
Screenshots
