Code Javascript Menu Deroulant Accordeons by Deluxe-Menu.com
Code Javascript Menu Deroulant Accordeons

Template:

Coffee Menu Template - Dropdown Html Menu






    - Transition #14 - "fade out" effect
    - Top items and submenus have a shadow
    - Deluxe Tuner - visual interface to create and modify dhtml menus easily and in no time.
    - Keyboard navigation - press Ctrl+F2 to enter the top menu
    - Items with icons
    - Text aligned to left
    - Status string shows item labels
    - Visible over select boxes, iframes, pdf, flash, Java applets.




2 0 Navigation Buttons by Web-Buttons.com v3.0.0
Buy Now!   ::  Free Trial Download   ::  Blog   ::  More Info

Menu Screenshots

Code Javascript Menu Deroulant Accordeons Dynamic Effects To Dropdown

Buy Now!   ::  Free Trial Download   ::  More Info

Features

Easy Setup
  • De Luxe Tuner. GUI interface to create your code javascript menu deroulant accordeons menus easily and in no time
  • Sensible menu parameters for manual editing
Cost Effective
Horizontal Mouse Over Pull Down Menu Code Javascript Menu Deroulant Accordeons
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
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



2.0 Buttons by Web-Buttons.com v3.0.0
Buy Now!   ::  Free Trial Download   ::  More Info

Javascript Menu. DHTML Menu.

  • There can be multi level menus - create as many rows or columns of the menu as you want.
  • Use a mouse to drag a menu as a usual window. Also you can construct the menu where each submenu can be "detached" from the main menu (MSOfficeToolbarLike mode).
  • When the page is scrolled the menu remains visible. The DHTML menu can "float" along one or two coordinate axes.
Buy Now!   ::  Free Trial Download   ::  More Info

Recent Questions

Q: I would like to call a popup window with javascript from a menu item.

A: You should add the code for popup window on your html page with the menu:
<!-- Deluxe Popup Window -->
<noscript><a href="http://deluxepopupwindow.com">menu drop down by DeluxePopupWindow.com</a></noscript>
<script type="text/javascript" src="deluxe-popup-window.files/dpopupwindow.js"></script>
<script type="text/javascript" src="deluxe-popup-window.js"></script>
<!-- (c) 2006, DeluxePopupWindow.com -->

Inside menuItems you should open the window in the following way:

["Click to open Popup Window","javascript:deluxePopupWindow.open('window1',
'http://deluxepopupwindow.com', 'Popup window',
'width=420,height=300,resizable,scrollbars=no,middle,right,fade-effect',
'windowsvista_graphite','iframe')",
"", "", "", "", "0", "", "", "", "", ],

More info about deluxePopupWindow.open() method you can find here:
http://deluxepopupwindow.com/window-installation-info.html

Q: I am testing it on my website.
I have under the submenu 'Generalites" two links "Presentation" and "Formulaires"
I would like when I click on what ever link on the expandable javascript menu that the visited link stay in a different color and with a different background.
For exemple:
If I click on link Presentation then this link will become in a different color and also its background.
Then If I click on Formulaire the prevous link is reset and the Formulaire link appears in a differemt color and its backgroud. How should I do it ?


A: Deluxe Tree doesn't save a pressed
item 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 dtreet_ext_setPressedItem (menuInd, itemID)

Please, see here:
http://deluxe-tree.com/functions-info.html

You can also set
  var tsaveState = 1;

More info you can find
http://deluxe-tree.com/data-samples/tree-menuxp-save-state.htm

To expand specific items you should use API function
function dtreet_ext_expandItem (itemID, expand)


Q: I'm trying to figure out how I can tie in this code loan_profile.asp?id= into the link on the tree menu, for example:

 ["|Loan Profile", "../pipeline/loan_profile.asp?id=<%=rsLoans("loan_id")%>", "", "", "", "", "", "2"],

When I try this and then test it in the browser the menu doesn't even show up and it says that there's an error... what can I do to fix this? Please get back ASAP. Thanks!

A: Try to write your code in the following way:

 ["|Loan Profile","../pipeline/loan_profile.asp?id=<%=rsLoans('loan_id')%>", "", "","", "", "", "2"],



Q: I am having two issues. 1. I am trying to create Deluxe-Tabs similar to the one here:
http://deluxe-tabs.com/file/templates/deluxe-tabs-style-4.html.
I do not see the feature for making the content in each of the event tabs. How is that done?

2. The second issue is that I am using a Deluxe-Menu on www.domain.com/default and when I navigate [ Activities > Football (ACTIVE LINK) ] for example, the link goes to the new page, but it does not keep the menu on the page. I am using master pages and the menu is on themain-master-page.

A: 1) You should paste your content in the <div> .. </div> tags.

<div id="content1" style=" visibility: hidden;" class="tabPage">
<br><br><br>
<p align=center><img src="img/logo_DM.gif" width=262 height=56 alt="Deluxe-Menu.com"></p>
</div>

<div id="content2" style="visibility: hidden;" class="tabPage">
<br><br><br>
<p align=center><img src="img/logo_DT.gif" width=262 height=56 alt="Deluxe-Tree.com"></p>

</div>

<div id="content3" style=" visibility: hidden;" class="tabPage">
<br><br><br>
<p align=center><img src="img/logo_DTabs.gif" width=254 height=58 alt="Deluxe-Tabs.com"></p>
</div>

See in Deluxe Tabs there are two modes:

1.   var tabMode=0;
You can create only one level of event tabs and assign Object Id's of theDIV's to show when you click on the tab.

["XP Tab 1","content1", "", "", "", "", "", "", "", ],
["XP Tab 2","content2", "", "", "", "", "", "", "", ],
["XP Tab 3","content3", "", "", "", "", "", "", "", ],
["XP Tab 4","content4", "", "", "", "", "", "", "", ],

2.   var tabMode=1;
You can assign only links in this mode.
You should create top level items with subitems.

["XP Tab 1","", "", "", "", "", "", "", "", ],
 ["|Link 1_1","http://deluxe-tabs.com", "", "", "", "", "0", "", "", ],
 ["|Link 1_2","testlink.htm", "", "", "", "", "0", "", "", ],
 ["|Link 1_3","testlink.htm", "", "", "", "", "0", "", "", ],
 ["|Link 1_4","testlink.htm", "", "", "", "", "0", "", "", ],
 ["|Link 1_5","testlink.htm", "", "", "", "", "0", "", "", ],
["XP Tab 2","", "", "", "", "", "", "", "", ],
 ["|Link 2_1","testlink.htm", "", "", "", "", "0", "", "", ],
 ["|Link 2_2","testlink.htm", "", "", "", "", "0", "", "", ],
 ["|Link 2_3","testlink.htm", "", "", "", "", "0", "", "", ],
 ["|Link 2_4","testlink.htm", "", "", "", "", "0", "", "", ],
 ["|Link 2_5","testlink.htm", "", "", "", "", "0", "", "", ],
["XP Tab 3","", "", "", "", "", "", "", "", ],
 ["|Link 3_1","testlink.htm", "", "", "", "", "0", "", "", ],
 ["|Link 3_2","testlink.htm", "", "", "", "", "0", "", "", ],
 ["|Link 3_3","testlink.htm", "", "", "", "", "0", "", "", ],
 ["|Link 3_4","testlink.htm", "", "", "", "", "0", "", "", ],
 ["|Link 3_5","testlink.htm", "", "", "", "", "0", "", "", ],

You can use Object ID as well as Link in both modes. Use the following prefixes within item's link field:
"object:" - means that there is object id after it;
"link:" - means that there is a link after it.
"javascript:" - means that there is a javascript code after it, for example:javascript:alert(\'Hello!\')

So, you should write for example:

 ["|Link 1_1","object:Content1_1", "", "", "", "", "0", "", "", ],

2) You have incorrect page structure.

Now you have several HEAD, BODY tags on your pages. It is not correct.

You should check your page structure.

Buy Now!   ::  Free Trial Download   ::  More Info