Home arrow DHTML arrow YADM-Yet Another Dynamic Menu

YADM-Yet Another Dynamic Menu

YADM is an accessible DHTML dropdown/flyout/explorer solution with complete separation of CSS and JavaScript. YADM was developed to help you create navigations that make sense, not to create whizz-bang navigations that are there for the sake of being flashy.

Author Info:
By: Christian Heilmann
Rating: 4 stars4 stars4 stars4 stars4 stars / 18
October 13, 2004
  1. · YADM-Yet Another Dynamic Menu
  2. · Using YADM -- Changing the Look and Feel
  3. · How it Works
  4. · Working with other Scripts, and What it Does Not Do

print this article

YADM-Yet Another Dynamic Menu
(Page 1 of 4 )

Dropdown navigations still seem to be cool and are part of almost every screen design these days. The fact that they cause a lot of accessibility and usability issues seems not to transpire, and clients keep asking for them. The amount of badly written, obstrusive, and bloated scripts is staggering. There are some very good ones though (Son of suckerfish, aqTree2, Gazingus), so why another one?

Why You Might Want to Use YADM

YADM was created with the following ideas in mind:

  • JavaScript Independence - YADM enhances a nested list in the markup, and doesn't generate any extra markup.

  • Mouse Independence - By applying the functionality when clicking and when hovering over the item keyboard users can also reach the nested menus, something that cannot be done in CSS-only solutions

  • Easy restyling - The look is maintained exclusively in CSS, YADM applies different classes to the markup to achieve that.

  • "Style on the fly" - You can define a style for the non-JavaScript menu and one for the JavaScript enhanced one in the same style sheet. Interactive elements get an own class indicating the user that this is not a simple link, but contains a hidden menu. Active elements get an own class.

  • No script knowledge necessary - Changes in the markup (adding classes) change the behaviour, rather than you knowing how to change the JavaScript.

  • Unobtrusive Javascript - Only applies itself if all is working (right markup, DOM-enabled browser) and works fine with other scripts

  • Browser independence - Although some browsers may behave oddly (Opera still has issues updating the screen, resulting in half-visible menus), the script does not sniff or check for any browser - just for objects.

blog comments powered by Disqus

- Text-Justify, Volume, and Other Style Sheet ...
- Ruby-Position, Size, and Other Style Sheet P...
- Padding, Pages, and More Style Sheet Propert...
- Marks, Orphans, and More Style Sheet Propert...
- Layouts, Margins, and Other Style Sheet Prop...
- Floats, Fonts, and Other Style Sheet Propert...
- Color, Filters, and Other Style Sheet Proper...
- Borders and More with Style Sheets
- Learning Style Sheet Properties
- Style Sheet Property Reference
- Completing a Noisy Image Application
- An Object-Based Approach to Building Noisy I...
- A Basic Method for Building Noisy Images
- Adding More Features to Sliders with the Scr...
- Using Sliders with the Scriptaculous Framewo...

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2019 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials