Iphone Expanding Menu by Deluxe-Menu.com
Iphone Expanding Menu

Menu Screenshots

Iphone Expanding Menu Menu In Jscript

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
Professional Look-n-feel
  • Entirely customizable look-n-feel
  • A lot of pre-designed iphone expanding menu samples
  • Hundreds of visual effects
  • Custom CSS styles can be applied for all menu settings
Javascript Createpopup Example Iphone Expanding Menu
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!
Cost Effective
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

Javascript Menu. DHTML Menu.

  • Create contextual menus for your pages. For this purpose you should assign a special function for the object you want. The current coordinates of the mouse pointer or your own ones can be used for the contextual menu.
  • When the submenu is larger than the visible area of the page the submenu will be automatically decreased. To see 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 automatically scrolled! You can also specify height and width for each separate submenu.
  • Build menus completely based on Cascading Style Sheets. It is possible to appoint the individual CSS styles for separate elements of the menu.

Recent Questions

Q: How do you specify different number of sub menu columns for each menu heading in the dhtml menu bar?

When I put   var smColumns = 5; it changed it for both my multicolumn headings.

A: You should use Individual Submenu Styles, for example:

  var menuStyles = [
["smColumns=3"],// 0 style
["smColumns=2"],// 1 style
];

  var menuItems = [
["Home","testlink.html", "", "", "", "", "0", "0", "", "", "", ],
["Product Info","", "", "", "", "", "0", "", "", "", "", ],
 ["|Features","testlink.html", "", "", "", "", "", "0", "", "", "", ], // 0 style
 ["|Installation","", "", "", "", "", "", "", "", "", "", ],
   ["||Description of Files","testlink.html", "", "", "", "", "", "", "", "", "", ],
   ["||How To Setup","testlink.html", "", "", "", "", "", "", "", "", "", ],
 ["|Parameters Info","testlink.html", "", "", "", "", "", "", "", "", "", ],
 ["|Dynamic Functions","testlink.html", "", "", "", "", "", "", "", "", "", ],
 ["|Supported Browsers","", "", "", "", "", "", "", "", "", "", ],
   ["||Windows OS","", "", "", "", "", "", "", "", "", "", ],
   ["||Internet Explorer","", "", "", "", "", "", "", "", "", "", ],
   ["||Firefox","", "", "", "", "", "", "", "", "", "", ],
   ["||Mozilla","", "", "", "", "", "", "", "", "", "", ],
   ["||Netscape","", "", "", "", "", "", "", "", "", "", ],
   ["||Opera","", "", "", "", "", "", "", "", "", "", ],
["Samples","", "", "", "", "", "0", "", "", "", "", ],
 ["|Sample 1","testlink.html", "", "", "", "", "", "1", "", "", "", ], // 1 style
 ["|Sample 2 is Disabled","testlink.html", "", "", "", "_", "", "", "", "", "", ],
 ["|Sample 3","testlink.html", "", "", "", "", "", "", "", "", "", ],
 ["|Sample 4","testlink.html", "", "", "", "", "", "", "", "", "", ],
 ["|Sample 5","testlink.html", "", "", "", "", "", "", "", "", "", ],
 ["|Sample 6","testlink.html", "", "", "", "", "", "", "", "", "", ],
 ["|Sample 7","testlink.html", "", "", "", "", "", "", "", "", "", ],
 ["|Sample 8","testlink.html", "", "", "", "", "", "", "", "", "", ],
 ["|Sample 9","testlink.html", "", "", "", "", "", "", "", "", "", ],
["Purchase","http://deluxe-menu.com/order-purchase.html", "", "", "", "_blank", "0", "", "", "", "", ],
["Contact Us","testlink.htm", "", "", "", "", "0", "", "", "", "", ],
];

Q: How change the color of the link in the dhtml vertical menu if the link is already visited.

A: Deluxe Menu has only two states normal and mouseover,
butyou can highlight menu items in two ways:

Try to do the following things:

- delete   var pressedItem=1; parameter from your data file
- set correct parameter on each page before you call data file, forexample:

<noscript><a href="http://deluxe-menu.com">Javascript Menu by Deluxe-Menu.com</a></noscript>
<script type="text/javascript">  var dmWorkPath = "menudir/";</script>
<script type="text/javascript" src="menudir/dmenu.js"></script>
<script type="text/javascript"<  var pressedItem=3;</script>

...<script type="text/javascript" src="menudir/data.js"></script>
You can also set a pressed item using Javascript API:

function dm_ext_setPressedItem (menuInd, submenuInd, itemInd, recursion)

Sets a current pressed item.
menuInd - index of a menu on a page, >= 0.
submenuInd - index of a submenu, >= 0.
itemInd - index of an item, >=0.
recursion = true/false - highlight parent items.

But notice, to use dm_ext_setPressedItem() you should know ID of selected item and subitem.
You can't get this ID after you reload your page. That is why you should write your own code on PHP.
You can find more info here:
http://www.deluxe-menu.com/highlighted-items-sample.html



Q: Actually, we figured out how to adjust the alignment of the text. What we would like to do is set a specific width for each item on the top level of the menu. Right now the width of the menu is based on the length of the item in that hotspot. We would like the width of each of those options to be the same.


A: You should use individual item styles. For example:

  var itemStyles = [
["itemWidth=123px"], //style 0
["itemWidth=150px"], //style 1
];

  var menuItems = [

["Home","testlink.html", , , , , "0", , , ], //style 0
["Product Info","", "deluxe-menu.files/icon1.gif", "deluxe-menu.files/icon1o.gif", , , "0", , , ], //style 0
["Text","", "deluxe-menu.files/icon1.gif", "deluxe-menu.files/icon1o.gif", , , "1", , , ], //style 1

Try that.


Q: Things are mostly working great. I want my menu to appear centered at the top the page. Here's the code:

<table style="text-align: left; width: 100%;" border="0" cellpadding="2"cellspacing="2">
<tbody>
<tr>
<td style="width: 100%; text-align: center;"><script type="text/javascript" src="navbar.js"></script>
</td>
</tr>
</tbody>
</table>

The table appears at the far left edge of the window. I tried with both absolute (x=20, y=10) and relative (both x and y unset) coordinates. Help!


A: If you want to center the menu paste itwithin the <div > or <table> with a static position and specify a center alignment for it, for example:

<DIV align=center>
<SCRIPT src="data/data.js" type=text/javascript>
</SCRIPT>
</DIV>

<table width=800>
<tr>
<td align=center width=600>

More Q&A

Mobile Design Pattern: Accordion Menu - Forum Nokia Wiki

Jun 29, 2009 ... Iphone Style Accordion Menu ... Provide some sort of animation while expanding the accordion, giving the user a sense of what is happening

WSG Forum - How to rip, convert DVD movies to iphone 4, iPad, iPod

Oct 15, 2010 ... Aneesoft.com is constantly trying to expand into more forms of multimedia ... First, you need to launch iTunes, click File option on menu,

Porting iPhone web app to WRT - a porting example - Forum Nokia Wiki

May 31, 2010 ... Create Options menu. Remember that iPhone is a touch-only device, .... potential user base for their applications will expand tremendously

Porting iPhone web app to WRT on Nokia devices - Forum Nokia Wiki

Lots of iPhone web apps in the market work on Nokia devices based on

How to create a menu with Cocos2D? - iPhone Dev SDK Forum

Hi there! I'm working in a Cocos2D game. I've started working in the game itself and now, once the game system is nearly completed,

Widgets + wordpress menu option (nav_menus) malfunction « WPML

1) widgets menu malfuntcion (I mean widgets in admin panel, ... works fine) - I can see part of inactive widgets and can do nothing to them (can't expand|move) ... WPtouch iPhone Theme. P.P.S.. wp_settings.php also has these strings:

HOW TO REMOVE BUZZ ICON FROM IPHONE GMAIL PAGE

Feb 17, 2010 ... Both of them blocked off our frequently used menu items without having to finger around trying to expand "More" item

Fs:apple Iphone 1gb,nokia N96 16gb,nokia N95 8gb,iphone 8gb

Expanding menus. single nested level · multiple nested levels ... Apple Iphone 16gb cost $300USD Apple Iphone 8gb cost $200USD

Stuck in Contacts Menu - iPhone 4 Forum

Jun 25, 2010 ... How do I get out of it? Am being really thick, I am sure!

HOW TO REMOVE BUZZ ICON FROM IPHONE GMAIL PAGE

Feb 17, 2010 ... Both of them blocked off our frequently used menu items without having to finger around trying to expand "More" item

WSG Forum - How to rip, convert DVD movies to iphone 4, iPad, iPod

Oct 15, 2010 ... Aneesoft.com is constantly trying to expand into more forms of multimedia ... First, you need to launch iTunes, click File option on menu,

RocketTheme • View topic - Language File for Gantry 3.0.1?

What's missing is the language file additions for the iphone settings. ... IPHONE_MENU=Menu; IPHONE_MENU_DESC=The iPhone Menu allows you to

JPG - Developer Discussion Boards

centerallyAlign { layout: horizontal-expand | horizontal-center

Porting iPhone web app to WRT on Nokia devices - Forum Nokia Wiki

Lots of iPhone web apps in the market work on Nokia devices based on

iPhone: Landscape Menu, Portrait Content

Feb 10, 2004 ... I was thinking of doing a version of a site for an iPhone that makes use of the onorientationchange event to switch between content and

Google Sync Gmail via Exchange / Activesync -- How to delete from

Sep 23, 2009... Menu->Manage Folders, expand the one called Gmail or Google Mail, ... Is there anyway to directly delete email from my iPhone using

JPG - Developer Discussion Boards

centerallyAlign { layout: horizontal-expand | horizontal-center

Mobile Design Pattern: Accordion Menu - Forum Nokia Wiki

Jun 29, 2009 ... Iphone Style Accordion Menu ... Provide some sort of animation while expanding the accordion, giving the user a sense of what is happening

MediaCoder • View topic - Working Preset for iPhone?

In the drop down box, select expand to fit. This will fill in the spaces ... The iPhone has a 480 x 320. So why the 640 x 480 video size?

MediaMonkey Changelog - OldApps.com

Aug 27, 2009 ... 4901 Fixed inability to copy music on iPhone / iPod Touch .... 4636 Fixed no link in context menu to change 'shortcut' options .... 4461 Fixed Drag & Drop to Tree cause tree to auto-expand, yielding unintended results

MediaMonkey Changelog - OldApps.com

Aug 27, 2009 ... 4901 Fixed inability to copy music on iPhone / iPod Touch .... 4636 Fixed no link in context menu to change 'shortcut' options .... 4461 Fixed Drag & Drop to Tree cause tree to auto-expand, yielding unintended results

RocketTheme • View topic - Language File for Gantry 3.0.1?

What's missing is the language file additions for the iphone settings. ... IPHONE_MENU=Menu; IPHONE_MENU_DESC=The iPhone Menu allows you to