Css Vertical Acordeon Menu Template by Deluxe-Menu.com
Css Vertical Acordeon Menu Template

Menu Screenshots

Css Vertical Acordeon Menu Template Javascript Tab Create

Features

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
High Performance
  • AJAX menu loading - loads web menu data from the server "on-the-fly".
  • Commonly loads quicker than other html page elements
  • UL/LI items structure
  • Runs well with an unlimited number of submenus and items
Menu Desplegable Javascript Source Css Vertical Acordeon Menu Template
Easy Setup
  • De Luxe Tuner. GUI interface to create your css vertical acordeon menu template menus easily and in no time
  • Sensible menu parameters for manual editing
Professional Look-n-feel
  • Entirely customizable look-n-feel
  • A lot of pre-designed css vertical acordeon menu template samples
  • Hundreds of visual effects
  • Custom CSS styles can be applied for all menu settings
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!



2.0 Buttons by Web-Buttons.com v3.0.0

Javascript Menu. DHTML Menu.

  • Good menu is an essential part of website commercial success. If people can't find their way around the site, they will fast give up seeking and retire, never to return. So, it's extreme serious that your website has a accurate, precise, prompt, and navigation of immaculate appearance.
    Don't let your web site guests to get lost. Try Deluxe Menu!

Recent Questions

Q: You've been helping me with some issues on the Deluxe Tree Menu system my company has purchased and most issues are resolved, so thank you! One big problem remains though and we can't seem to figure it out, so I hope you can help.

What we want is, when a user enters our site from the index (home) page then clicks on a link and the sub-page opens, for the dhtml menu tree to be open to the section the user is in and viewing. We also DO NOT want the browser to save the state of the menu, since that is inconsistent with where the user is in the site. Note: we do not use the Menu on the home page, is this a problem?

Per your tech support email, I've added the expand code, which works going from the home page to sub-pages. However, it interferes with navigating to other sub-pages once your in the site. The menu doesn't keep the section open, it closes back up. You mentioned the expand code has to be entered on every page....is that so in this instance and if so, that's a maintenance nightmare - does a better way exist for this type of menu?

Then we activated the "save state" option and the menu stays open on the sub-pages, but the expand option doesn't work.
It's like they cancel each other out and you can only have one or the other.

Can I get these two to work together? What do I need to do? Is it better to use the XP-style menu?

A: When user clicks the link, the browser loads a new page and the script re-create the dhtml menu tree.
If you want to open the needed section automatically on load you can use the following:

1. Save the state to cookies
2. Use frames
3. Put the special script on each page of site that will open appropriate section.
(dtreet_ext_expandItem)



Q: I didn't specify link for the item, but the problem is the mouse cursorchanges to a hand, when the item of the web navigation bar (not link) is mouse over.

A: Unfortunately there is no way to change cursor for items with links and without links.

You can try to use <a> tag inside the text field:

["<a href="http://domain.com/index.html">test</a>","",""]



Set default cursor:
  var titemCursor="default";




Q: I want to buy your product today, but have a few questions:

How do I change the font style for java menu templates to 9pt Verdana bold, but leave the sub-menus 9pt Verdana normal? I understand there’s a "fontStyle" variable, but is there an "itemfontStyle"? How do I make the left hand padding greater for the menu? I’m using the XP Style 1 and the far left top menu item is running up against my left hand border. I want to add about 10px of spacing to the left of the menu. How do I make the options in a menu have equal spacing? For instance, if there are 5 items in the menu, how can each have 100% / 5?

A: You can use Individual Item styles to set specific parameters for eachitem or submenu.

1.
  var fontStyle=["normal 9pt Verdana","normal 9pt Verdana"]; //for subitems
//style for the top items
  var itemStyles = [
["itemHeight=21px","itemBackColor=#F2F3F2,#1665CB","fontStyle='bold 9pt Verdana','bold 9pt Verdana'"],
];

2., 4. You should specify itemPadding parameter in "px". You shouldadd "px" in your style for subitems:
  var menuStyles = [
["menuBackColor=#F2F3F2","menuBorderWidth=0","itemSpacing=1","itemPadding=4px","smOrientation=undefined"],
];

Notice also that you can set multiple value for itemPadding parameter,for example:

itemPadding=4px 10px 4px 10px
top right bottom left
4. You should set the exact width for the java menu templates:
  var menuWidth="500px";
and set width for the top items using Individual styles:
["itemWidth=100px","itemHeight=21px","itemBackColor=#F2F3F2,#1665CB","fontStyle='bold 9pt Verdana','bold 9pt Verdana'"],

Unfortunately it is not possible to specify item's width in '%' inIndividual styles. The following width parameters won't work.

  var menuWidth="100%";
["itemWidth=20%","itemHeight=21px","itemBackColor=#F2F3F2,#1665CB","fontStyle='bold 9pt Verdana','bold 9pt Verdana'"],



Q: How can I set the top-level menu items of the html pop up menu to be transparent?

A: You should create Individual Item and Submenu styles with transparent itemBackColor and assign it for the top items:

  var itemStyles = [
["itemBackColor=transparent,transparent","itemBorderWidth=0","fontColor=#000000,#000000"],
];

  var menuStyles = [
["menuBackColor=transparent","menuBorderWidth=0"],
];