WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: good examples of javascript "roll over" menus with an accessible alternative

for

From: Christian Heilmann
Date: Jul 28, 2005 2:09PM

> I'm working with a client who has committed to designing with CSS. This
> has been a real struggle for them, so I'm trying to speed them along with
> some examples that won't require them to sacrifice "look and feel," at
> least as much as possible.
>
> They want to have those javascript menus that show choices when the user
> rolls over the main choice with a mouse.
>
> Does anyone have good visually appealing examples that render in an
> alternative fashion when javascript is turned off, when the keyboard is
> used, and/or when a screen reader is used?
>
> I was looking at what Google offers when searching on keywords such as
> "accessible javascript menus," but the resulting articles didn't seem to be
> terribly current.
>
> Thanks for any links to sites or articles.Apologies, in advance, for
> potential cross-posting

Check my YADM: http://www.onlinetools.org/tools/yadm/reldropdown.html

They are styled lists with CSS and JS is only used for the behaviour.
You can even define a style for non JavaScript and one for JavaScript
browsers. All menus work onclick and onmouseover, which also means
they are keyboard friendly.

The demo page is not the nicest, but back then all I wanted to offer
is the script. The CSS is your job.



--
Chris Heilmann
Blog: http://www.wait-till-i.com
Writing: http://icant.co.uk/
Binaries: http://www.onlinetools.org/