Extjs Menubar Example by Deluxe-Menu.com
Extjs Menubar Example

Menu Screenshots

Extjs Menubar Example Javascript Hiding Navigation Bar Code Samples

Features

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
Javascript Hover Layer Extjs Menubar Example
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!
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
Easy Setup
  • De Luxe Tuner. GUI interface to create your extjs menubar example menus easily and in no time
  • Sensible menu parameters for manual editing



2.0 Buttons by Web-Buttons.com v3.0.0

Javascript Menu. DHTML Menu.

  • Tune menu parameters manually or using Deluxe Tuner. Then add several rows of a code within html page - your menu is ready!
  • Use special JavaScript functions for: Dynamic changing of items (text, link, icons and even individual style!). Making a menu item active/inactive. Addition/removing of items. Changing of visibility of items. Getting the information on any menu, submenu and items. Other tricks.
  • Opportunity to control the menu from the keyboard.
  • Cross-frame mode allows you to build full-featured menus on the pages that use frame-based structure. But for all that it's not necessary to insert any additional code into all the pages - just specify some additional parameters of the menu.

Recent Questions

Q: The button menu is on the top of the screen but it has lines through each of the menus just after the words and before the arrow on each of them.
I have stretched the menu out tocover the whole of the top of the page but i need to get these lines out of the menu.

Can you please help me with this problem


A: See images in Vista Templates have the fixed width and height (92 x21):

  var itemStyles = [

["itemWidth=92px","itemHeight=21px","itemBackColor=transparent,transparent","itemBorderWidth=0",
"fontStyle=normal 11px Tahoma","fontColor=#3A3A3A,#000000","itemBackImage=data-vista-2-04.files/btn_olive.gif,data-vista-2-04.files/btn_white.gif"],
];

When items text is too long you can have such effect.

You can try to use combined background for your items, for example:

  var beforeItemImage = [,]; //left-side image for normal and mouse over state
  var itemBackImage = [,]; //background or image for normal and mouse over state
  var afterItemImage = [,]; //right-side image for normal and mouse over state
  var beforeItemImageW = '';
  var afterItemImageW = '';
  var beforeItemImageH = '';
  var afterItemImageH ='';

But you should create a small images in any Graph Editor, for example:
button_n_back.gif
button_n_left.gif
button_n_right.gif
button_o_back.gif
button_o_left.gif
button_o_right.gif


Q: From http://deluxe-menu.com/recent-questions-support.html
I have read:

Jul 25, 2008 - I am still interested if there is a dynamic way to rebuild (and restructure) a javascript menu example..
Q: So, I am still interested if there is a dynamic way to rebuild (and restructure) a menu w javascript, just for interest.
A: No, unfortunately it is not possible to rebuild the menu without reloading of the page now. We'll add this feature in the next version of the menu.

Can you say anything about date for that funcion?

May-be the function is ready in an un-officiel version?

I have buy this product-collect, and is in touch to implement dynamic 'ajax' menu with php, And the function to reload menu will be very pretty

A: It is not possible to rebuild/reload the menu at once,but you can use our API function to change any menu itemsw/0 page reloading, please see
http://deluxe-menu.com/functions-info.html
http://deluxe-menu.com/dynamic-functions-sample.html

Also please check
http://deluxe-menu.com/ajax-technology-menu-sample.html



Q: I want to have the pop up window display as you mouse over an image/link - is this possible?

A: For example you want to open a popup onMouseover, onClick or
onMouseout on a link.

So, you should create a link on your page and set id="" for it, forexample:

<a href="javascript:;" id="link">Open popup OnClick</a>
<a href="javascript:;" id="over">Open popup OnMouseover</a>
<a href="javascript:;" id="out">Open popup OnMouseOut</a>

In Deluxe Tuner you should set:
onMouseOver - over
onMouseOut - out
onClick - link

So you'll have

deluxePopupWindow.attachToEvent(win,',,onClick=link,onMouseOver=over,onMouseOut=out,')



Q: I just noticed as well that I cannot change the spacing of the buttons.
Right now the buttons are tight together, how do I create a gap between each button in the link drop down menu?

A: You can paste the separator.
You should add separators between your items, use "Add separator" button on the mainwidow of Deluxe Tuner.

  var menuItems = [

["FHSA","", "", "", "", "", "", "", "", "", "", ],
["-","", "", "", "", "", "", "", "", "", "", ],
["Chapters","", "", "", "", "", "", "", "", "", "", ],
["-","", "", "", "", "", "", "", "", "", "", ],
["AZ Resources","", "", "", "", "", "", "", "", "", "", ],
["-","", "", "", "", "", "", "", "", "", "", ],
["Double Butte Cemetery","", "", "", "", "", "", "", "", "", "", ],
["-","", "", "", "", "", "", "", "", "", "", ],
["Surname List","", "", "", "", "", "", "", "", "", "", ],
["-","", "", "", "", "", "", "", "", "", "", ],
["Helping Hands","", "", "", "", "", "", "", "", "", "", ],
["-","", "", "", "", "", "", "", "", "", "", ],
["Book Fund Purchases","", "", "", "", "", "", "", "", "", "", ],
];

  var separatorVImage="separv1.gif";
  var separatorVWidth="1px";
  var separatorVHeight="21px";