Javascript Slide Out Side Tab by Deluxe-Menu.com
Javascript Slide Out Side Tab

Menu Screenshots

Javascript Slide Out Side Tab Menu Bar Internet Explorer

Features

Professional Look-n-feel
  • Entirely customizable look-n-feel
  • A lot of pre-designed javascript slide out side tab samples
  • Hundreds of visual effects
  • Custom CSS styles can be applied for all menu settings
Seamless Integration
  • Cross-frame support - menus work on frameset-based pages
  • Visible over flash, select boxes, iframes, java applets
  • Multiple menus on the same page
  • Amicable to other scripts and css styles
  • Any HTML code can be used inside menu items
Tree Menu Css Lists Javascript Javascript Slide Out Side Tab
Unrivalled Features
  • Scrollable, dragable, floating, right-click menus
  • Keyboard navigation - press Ctrl+F2 to enter the menu
  • Unique Java Script API for altering menu "on-the-fly", without page reloading
  • AJAX technology - loads menu data from the server "on-fly and on-demand".
  • Search feature - add the search area in the menu and type symbols. The found words will be higlighted.
  • Sound support!
Compatibility              
  • Full cross-browser compatibility including IE, Netscape, Mozilla, Opera, Firefox, Konqueror and Safari on Windows, Mac OS and Linux
  • Menu can be populated from a database using ASP, PHP, etc.
  • Search engine friendly
  • Support for any doctypes
  • Fits for secure sites
  • Section 508 compliant
Cost Effective



2.0 Buttons by Web-Buttons.com v3.0.0

Javascript Menu. DHTML Menu.

  • Build right-click menus for your site. For this purpose you should appoint a peculiar method for the object you want. The current X,Y of the mouse pointer or your own ones can be used for the context menu.
  • Design menus absolutely based on CSS (Cascading Style Sheets). It is possible to apply the personal CSS styles for every elements of the menu.
  • When the submenu is bigger than the visible page area, the size of submenu will be automatically decreased. To view all the submenu items you do not need to use scrollbars or something like that - just put your mouse to the bottom of a submenu and it will be automagically scrolled! You can also define width and height for each submenu.

Recent Questions

Q: I have another question regarding the popup window. I need to use an iframe within the popup window. Is there any way I can close the onmouseover popup from the page loaded within the iframe? Something like "parent.document.getElementById('windowid').hide();". Any help would be appreciated.

A: You can close the onmouseover popup using the following function:document.getElementById('win').hide();

Unfortunately it won't work if you use iframe as window content.
You open another page in the popup (in Iframe) so you cannot accessdocument.getElementById('win').hide();
element which is situated on the first page.

When you use text or object_id as window content the content of the popup will be situatedon the same page so you can access document.getElementById('win') element and hide it.

There is a workaround.
Use text as content type and add the following code inside popup:

<a onclick="document.getElementById('win').hide();">...</a> <iframe></iframe>

Your link will work in that case.


Q: I am trying out your program and it's really sweet. I have 1 little problem. I created the menu everything works in IE7. In firefox the menu is about 4 or 5 px longer. It seems like in firefox there is a border around each top level item although I have set all borders to 0 (I can see that because I have set roolover color of background to opposite of normal color)


A: Try to set exact width for the menu in "px".

For example:
  var menuWidth="600px";


Q: At the very beginning of each javascript close menu item (exception for top level item using "XP-Style") there is always a small gap of 2px width.

Firebug show me this small piece of code :
***********************************
<td id="" style="margin: 0px; padding: 0px;">
<img id="" width="2" height="1" border="0" style="display:
block;" src="images/blank.gif"/>
</td>
***********************************

Is there a way to avoid this ?

A: You should set the following parameter in that case:

  var tXPBorderWidth=0;



Q: How can I have the sub tab option that initiated the action highlighted once the new page is reloaded?  I want to highlight the tab which is done with 'bselectedItem', please tell me about the sub-tab option.

A: See you cannot create subitems in
  var tabMode=0;
it is not correct.

You should set
  var tabMode=1;

The following parameters set the pressed items for top items andsubitems:

  var bselectedItem=0; //top items
  var bselectedSmItem=2; //subitems

where 0,1,2... is the index of the item in bmenuItems.

- delete   var bselectedItem=1; and   var bselectedSmItem=2; parameters from your data file
- set correct parameters on each page before you call data file, forexample:

<noscript><a href="http://deluxe-tabs.com">Javascript Menu by Deluxe-Tabs.com</a></noscript>
<script type="text/javascript" src="menudir/dtabs.js"></script>
<script type="text/javascript">  var bselectedItem=3;
  var bselectedSmItem=5; </script>
...
<script type="text/javascript" src="menudir/data.js"></script>