• content
• navigation
• access
• search

Popup menus, absolutely positioned

• Home
• About UDM ...
• Demos ...
• Purchase
• Download
• Support ...
• Contact
• Brothercake

This demo uses one of the following configuration files:

popup-absolute.js

Javascript configuration (for ASP config add <% %> instructions and rename)

popup-absolute.ini

PHP configuration

And the following images:

• greenshadow.png (green menu dropshadow)
• orangeshadow.png (orange menu dropshadow)
• right-green.gif (green menu right-arrow)
• right-black.gif (green menu right-arrow rollover)
• right-purple.gif (orange menu right-arrow)
• right-blue.gif (orange menu right-arrow rollover)

The menu-handling code looks like this:

• Skip code example

//open menu with given ID and co-ordinatesfunction openMenu(menuID,menuX,menuY){	//if the menu code is ready	if(um.ready)	{		//activate menu		um.activateMenu(menuID, menuX + 'px', menuY + 'px');	}}//close menu with given IDfunction closeMenu(menuID){	//if the menu code is ready	if(um.ready)	{		//deactive menu		um.deactivateMenu(menuID);	}}

and is triggered from this HTML:

• Skip code example

<ul>	<li><a href="/" title="UDM Home page">		Home</a></li>	<li><a href="/menu/"		onmouseover="openMenu('about',200,155)"		onmouseout="closeMenu('about')">		About UDM ...</a>	</li>	<li><a href="/demos/"		onmouseover="openMenu('demos',220,205)"		onmouseout="closeMenu('demos')">		Demos ...</a>	</li>	<li><a href="/licensing/">		Purchase</a>	</li>	<li><a href="/licensing/download/">		Download</a>	</li>	<li><a href="/menu/support/" title="Help and support"		onmouseover="openMenu('support',180,255)"		onmouseout="closeMenu('support')">		Support ...</a>	</li>	<li><a href="/contact/" title="Contact the author">Contact</a>	</li>	<li><a href="/" title="Brothercake home page">Brothercake</a>	</li></ul>

For more about this configuration, please read the popup menu examples documentation.

• ← Previous demo
• Buy Now!
• Next demo →