Javascript Expandable Menu by Deluxe-Menu.com
Javascript Expandable Menu

Menu Screenshots

Javascript Expandable Menu Tutorial Cross Browser Dhtml Drop Down Menu

Features

Cost Effective
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
Javascript How Select Javascript Expandable Menu
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
Professional Look-n-feel
  • Entirely customizable look-n-feel
  • A lot of pre-designed javascript expandable menu 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.

  • Submenus drop down over all the objects of the page (select, flash, object, embed, applet). If for some reasons a submenu can't drop down over an object, the latter will be hidden for a time when the submenu is shown.
  • These effects will make your menu more attractive and stylish. You can cast a shadow on the menu and submenus, set transparency. Among available transitional effects there are such as fade, mosaic, random dissolve, slide out and many others.
  • Create individual styles and assign them to any submenu and item. Use individual styles to achieve stunning effects!

Recent Questions

Q: For example if you use the Growing Goodness menu located under Media Categories the first category is Agriculture w/ a sub category "Community Supported (CSA)" it is the sub category that is an active link. Is it possible to have only the active link "Community Supported (CSA) underlined and not Agriculture? And the same for all the other active links in this menu, all that have hyperlinks assigned to them.

A: You can write your links in the following way:

["Channels","", , , , , , , , ],
 ["|<a class='menu' href='http://growinggoodness.com/callingfromthecoast.htm'>Eco-Friendly</a>","", , , , "_self", , , , ],
 ["|<a class='menu' href='http://growinggoodness.com'>Farmers Market</a>","", , , , "_", , , , ],
["Media Categories","", , , , , , , , ],
 ["|Agriculture","", , , , , , , , ],
   ["||<a class='menu' href='http://growinggoodness.com/csa.htm'>Community Supported (CSA)</a>","", , , , "_self", , , , ],
   ["||Movie Trailers","", , , , , , , , ],
   ["|||<a class='menu' href='http://growinggoodness.com/farmboymovie.htm'>Farmboy</a>","", , , , "_self", , , , ],
   ["|||<a class='menu' href='http://growinggoodness.com/strongrootsfragilefarms.htm'>Strong Roots, Fragile Farms</a>","", , , , "_self", , ,, ],
   ["|||<a class='menu' href='http://growinggoodness.com/therealdirtonfarmerjohn.htm'>The Real Dirt On Farmer John</a>","", , , , "_self", , ,, ],

And create a style:
A.menu {
color: #FFF;
text-decoration: none;}
A.menu:hover {
color: #FFF;
text-decoration: underline;}




Q: Is there an option for word wrap or do I have to create my javascript menu button if I want to have a 2-line menu item?

A: To wrap your text you can use the following javascript menu button parameter:

  var tnoWrap=0;

you can also use standard <br> tags.

 ["|Home aaaa aaaaaa aaaaaa<br>aaa aaaaaaaaaaa","testlink.htm", "default.files/icon1_s.gif", "default.files/icon1_so.gif", "", "Home Page Tip", "", "", "", ],



Q: I have a question regarding deluxe tab implementation.Can you guide me on how to change tab selection dynamically for the tabbed navigation.

A: Deluxe Tabs doesn't support API functions which can return the selected tab.

You can set "bselectedItem" and "  var bselectedSmItem" parameters based on your link before you call your data file.

For example, move "  var bselectedItem" and "  var bselectedSmItem" parameters from your data file to your code.

<TD vAlign=top align=left>
/* Select Tab */
<script type="text/javascript" language="JavaScript1.2">
  var bselectedItem=   var bselectedSmItem= </script>
<SCRIPT src="data.js" type=text/javascript></SCRIPT>
</TD>

You should define seltabs and selsmtabs using server side script.

You can also set it on every page before you call data.js file, for example:

<TD vAlign=top align=left>
/* Select Tab */
<script type="text/javascript" language="JavaScript1.2">
  var bselectedItem=4;
  var bselectedSmItem=3;
</script>
<SCRIPT src="data.js" type=text/javascript></SCRIPT>
</TD>

Q: I've been trying to get the menu item in dynamic tree menu to stay highlighted when clicked on and directed to that page.

A: Tree Menu doesn't save a presseditem as it saves a tree state.
It works within 1 page only and if youreload the page you should set a pressed item using Javascript API:

function apyt_ext_setPressedItem(menuInd, itemID)

<script type="text/javascript">

  var i = 4 //index of the selected item
onload=setPressed;
function setPressed()
{
dtreet_ext_setPressedItem(0,dtreet_ext_getItemIDByIndex(0, i));
}


To expand specific items you should use the following function:
dtreet_ext_expandItem (dtreet_ext_getItemIDByIndex (0, 11), 1);