Miscellaneous Hacks - Floating Side Menu

Floating Side Menu

This mod is no longer supported...

Origin: DynamicDrive.com
Original Script: Omni Slide Menu
? John Davenport Scheuer
* Adapted from Dynamic-FX Slide-In Menu (v 6.5) script
by maXimus
Supported Browsers: FF1+ IE5+ Opr7+

This mod has been tested and works on vbulletin version 3.6.8 PL2.
This is a DHTML script for general forum use. Do not ask if it can be used for certain User Groups or given Permissions.

Features:

This mod places a floating menu on the right, or left of all of your forum pages. To place it on the left, edit the following code in menuItems.js:

Find...

menupos:'right',

Replace with...

menupos:'left',

Edits:

• Edit menuItems.js for links and colors
• Edit mmenu.js for bar, headers and other variables
• Edit forum header template(s)
• Instructions included within attached .zip file

Customization:

• menuItems.js: use this file to name your menu and create your links
• mmenu.js: use this file to customize the look of your menu
• Refer to the "Properties" page for variable descriptions
• Refer to the code below to adjust your link attributes within the menu (i.e., link text color, hover, visited). The code below is what you will be putting at the top of your forum's header template. Items in red are editable:

<style type="text/css">
                            /*Menu Links*/

/*NOTE: anything not specified for the #(menu id's) a selector and its pseudo classes
may be inherited in some browsers from other 'a' element styles (if any) on the page*/

#kbmenu3 a { /*Menu3 Links*/
color:black;
background-color:white;
text-decoration:none;
text-indent:1ex;
}
#kbmenu3 a:hover {
color:black;background-color:#FFFF99;
}
#kbmenu3 a:active	{color:black;text-decoration:none;}
#kbmenu3 a:visited	{color:black;text-decoration:none;}


                           /*End Menu Links*/
</style>
<script src="mmenu.js" type="text/javascript"></script>
<script src="menuItems.js" type="text/javascript">

/***********************************************
* Omni Slide Menu script - ? John Davenport Scheuer: http://home.comcast.net/~jscheuer1/
* very freely adapted from Dynamic-FX Slide-In Menu (v 6.5) script- by maXimus
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full original source code
***********************************************/

</script>

Live Demo: Demo

Hope you like this simple little mod...if so, please, don't forget to rate it.

[Saviour]

Originally Posted by Direct Vision

For Me It's Not Working Good

The Links Come On Top Left Of The Forum. Before The Logo

What Can I Do?

Make sure you paste the following code before the <!--logo> tag in the header template:

<style type="text/css">
/*Menu Links*/

/*NOTE: anything not specified for the #(menu id's) a selector and its pseudo classes
may be inherited in some browsers from other 'a' element styles (if any) on the page*/

#kbmenu3 a { /*Menu3 Links*/
color:black;
background-color:white;
text-decoration:none;
text-indent:1ex;
}
#kbmenu3 a:hover {
color:black;background-color:#FFFF99;
}
#kbmenu3 a:active {color:black;text-decoration:none;}
#kbmenu3 a:visited {color:black;text-decoration:none;}


/*End Menu Links*/
</style>
<script src="mmenu.js" type="text/javascript"></script>
<script src="menuItems.js" type="text/javascript">

/***********************************************
* Omni Slide Menu script - ? John Davenport Scheuer: http://home.comcast.net/~jscheuer1/
* very freely adapted from Dynamic-FX Slide-In Menu (v 6.5) script- by maXimus
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full original source code
***********************************************/

</script>

Make sure you change the red code above to what you have named your menu.

I have also noticed a problem for those of you who are using a web template hack...such as myself.

I use WebTemplates 3.5.x: VB Integrated CMS (Content Management System) by Logician. Check the theme you are using for your template(s) and make sure the following variable is included at the top of that template: $stylevar[htmldoctype].

The above should fix your problem...let us know...

[Direct Vision]

Oooooook Now It's Working Good

Just Another Question Can I Change The Colour Of The Bar???

I Want It Blue

[Saviour]

You sure can...

In the mmenu.js file find the following line:

if(!o.barbgcolor) {o.barbgcolor="#336699"};

Just change the text color code to whatever color you want.

For additional variable changes...go here.

[Direct Vision]

one other thing

from where i increase the width of the menu cause text (links) when they are long comes in two lines

[Saviour]

Direct Vision...

Did you look at the variable changes page I listed in my last post?

Find this in your mmenu.js file:

if(!o.hdingwidth) {o.hdingwidth=149};

As noted on the variable changes page:

hdingwidth:149,  // This will be the menu body width as well as any single column headings.

Changing the number should change the width of your menu.

Note:

Remember, this mod is not supported...yet I will do my best to help...and I will only help those who have marked this mod as "Installed".

[Fungsten]

Originally Posted by yoyoyoyo

I haven't tried it, but this should work...

change:

<script src="mmenu.js" type="text/javascript"></script>
<script src="menuItems.js" type="text/javascript">

to:

<script src="$vboptions[bburl]/forum/mmenu.js" type="text/javascript"></script>
<script src="$vboptions[bburl]/forum/menuItems.js" type="text/javascript">

if your forum is in a different directory, such as "forums," then change the replacement code accordingly.

Please let me know if it works for you.

Where does one change that? Thanks.

[Saviour]

You will find it within the code you will be adding to your header template:

<style type="text/css">
                            /*Menu Links*/

/*NOTE: anything not specified for the #(menu id's) a selector and its pseudo classes
may be inherited in some browsers from other 'a' element styles (if any) on the page*/

#kbmenu3 a { /*Menu3 Links*/
color:black;
background-color:white;
text-decoration:none;
text-indent:1ex;
}
#kbmenu3 a:hover {
color:black;background-color:#FFFF99;
}
#kbmenu3 a:active	{color:black;text-decoration:none;}
#kbmenu3 a:visited	{color:black;text-decoration:none;}


                           /*End Menu Links*/
</style>
<script src="mmenu.js" type="text/javascript"></script>
<script src="menuItems.js" type="text/javascript">

/***********************************************
* Omni Slide Menu script - ? John Davenport Scheuer: http://home.comcast.net/~jscheuer1/
* very freely adapted from Dynamic-FX Slide-In Menu (v 6.5) script- by maXimus
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full original source code
***********************************************/

</script>

Change the above red code.

[Direct Vision]

ok all done thanks alot bro, you rock.

this is great

[Saviour]

Originally Posted by Direct Vision

ok all done thanks alot bro, you rock.

this is great

Thank you...don't forget to click "Installed".

[Fungsten]

Originally Posted by Saviour

You will find it within the code you will be adding to your header template:

<style type="text/css">
                            /*Menu Links*/
 
/*NOTE: anything not specified for the #(menu id's) a selector and its pseudo classes
may be inherited in some browsers from other 'a' element styles (if any) on the page*/
 
#kbmenu3 a { /*Menu3 Links*/
color:black;
background-color:white;
text-decoration:none;
text-indent:1ex;
}
#kbmenu3 a:hover {
color:black;background-color:#FFFF99;
}
#kbmenu3 a:active    {color:black;text-decoration:none;}
#kbmenu3 a:visited    {color:black;text-decoration:none;}
 
 
                           /*End Menu Links*/
</style>
<script src="mmenu.js" type="text/javascript"></script>
<script src="menuItems.js" type="text/javascript">
 
/***********************************************
* Omni Slide Menu script - ? John Davenport Scheuer: http://home.comcast.net/~jscheuer1/
* very freely adapted from Dynamic-FX Slide-In Menu (v 6.5) script- by maXimus
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full original source code
***********************************************/
 
</script>

Change the above red code.

I tried it but then the whole Menu disappeared.