All posts in ADxMenu

The ultimate drop menu

ADxMenu – multilevel menu built from nested HTML lists – is my pride and joy. I began working on it last year, always implementing the good stuff I learned on the web standards road. In its current incarnation, I believe it’s best of the breed. There are other menus out there (using the very similar HTML base), but most of them can, at most, measure up to ADxMenu standard.

With that said, I want to repeat what was my target from day 1. It’s valid, standard-compliant web sites. If you have an old-school web site with nested tables and no DOCTYPE – do not bother; you have other things to conquer first. On the other hand, if you are a CSS newbie/inter/pro – you are welcomed. You will need good CSS skills to create attractive menus though; I did my best to give you a good starting point, for 4 different variants of the menu, but the final look is up to you.

There are many old-school menus with large scripts and over-bloated markup. Those few that are good and light are not free. ADxMenu3 is free to use on any kind of site, as long as you give proper attribution.

Continue Reading →

New ADxMenu in sight

You might’ve not noticed, but beta version of ADxMenu 3 is up since the new blog was published. There are still loose ends in the enterprise version, but the hardest part is over and I can proudly say that it promises to be the menu, for all sites and possible uses.

Highlights:

  • submenus can freely go one over another, even in IE (no unwanted overlap anymore)
  • clean separation of IE hacks in separate .css file, which only IE loads
  • reworked whatever:hover so it deals only with menu elements (no page-onload freeze anymore)
  • three different version, so you can pick what suits you best
  • mildly simpler CSS

I’ll be away this weekend, but you can expect full write-up next week. Until then, please report errors you find (and in which browser, version) in comments.

There’s some light at the far end…

Continue Reading →

Four variants of drop-down menu

It seems like years…

ADxMenu
Having established (or so I thought) the basis for good, versatile, menu system, I figured it’s about time to make it truly powerful. I wanted it to:

  • be placed anywhere and to open-up in any direction
  • work in CSS2-capable browsers and IE5+/Win
  • provide b-version script for use with other browsers (mostly IE5/Mac)
  • circumvent the drop-down problem on IE/Win
  • avoid scroll bars upon page load (while menus are hidden)
  • prevent IE from drawing tall submenus over prev/next parent menu options

Well, I did all that, and I did none of that.

Continue Reading →

Drop-up menu

Due to popular request (hi xeon :), I have updated the examples with the drop-up version. This is useful if you want to place the menus in the page footer.
This is the only important part:

CSS:
  1. /* fix the position */
  2. #menu li ul {
  3. bottom: 1.5em;
  4. left: 0;
  5. }
  6. #menu li li ul {
  7. bottom: 0;
  8. left: 100%;
  9. }

1.5em is just an example value. You need to modify it according to menu make-up (as shown in the examples).

Continue Reading →