View Full Version : Hybrid CSS / Javascript multi-level menu

04-28-2009, 09:30 PM
1) CODE TITLE: menuposition

2) AUTHOR NAME/NOTES: Brian Katzung, Kappa Computer Solutions, LLC

3) DESCRIPTION: Multi-level drop-down, raise-up, and fly-out/slide-out HTML-structured menu. Uses CSS for basic visibility (when Javascript is off/disabled), and Javascript for "smart" placement near window edges and for IE work-arounds.

More description at


A sample test page is included in the downloads. This menu system is the one in use at http://www.kappacs.com/, as well as several other sites.

Feedback and suggestions welcomed.

04-28-2009, 10:15 PM
The CSS on all the pages appears to be missing.

04-29-2009, 12:21 AM
The CSS on all the pages appears to be missing.

Hmm... I'm not quite sure what you mean...

The two archives on the download page (one in ZIP format and the other in gzip'ped tar format) each contain these files:

menuposition.css - Basic CSS and sample menu implementation styling
menuposition.js - Enhanced display logic
viewport.js - Viewport support used by menuposition.js
mptest.html - Test page (includes embedded CSS)

So if you're working with mptest.html, the CSS is embedded. If you're working with your own pages, link or embed menuposition.js, viewport.js, and menuposition.css. Either prototype.js or mootools.js is also required, as referenced in the article on my site.

On the www.kappacs.com (http://www.kappacs.com/) web site, the CSS is incorporated into the Joomla template CSS (http://www.kappacs.com/templates/kappacs2.0.1/css/template_css.css). It is a superset of the archived menuposition.css.

Does that resolve your concern? If not, please rephrase it in more detail.

04-29-2009, 12:26 AM
Actually, I think he was talking about the layout and images, take a look.
http://img201.imageshack.us/img201/6005/captureito.th.png (http://img201.imageshack.us/my.php?image=captureito.png)

Is it supposed to be like this?

I really like it, maybe add a little animations to it? ( The reason for this is because there are thousands of menus exactly like this online, and you want yours to be unique, and widely used)

04-29-2009, 03:11 AM
Oops... an http/https interaction failure mode resulting from a recent unrelated configuration change. Should be all fixed now.

Thank you for the suggestion about animation.