WebAIM - Web Accessibility In Mind

E-mail List Archives

Showing / Hiding a Layer

for

From: David Ashleydale
Date: Apr 1, 2009 12:20PM

Have any of you come across a good, accessible example of hiding and showing
a layer on a web page?

I'm trying to implement this type of behavior: a link that a user can hover
their mouse over or click to show a layer on top of the page that displays
info about the link. For example, the text of a link says "amortization". If
a user wants to get a definition of the word "amortization", they can hover
their mouse over it or click on it. When they do so, a box appears near the
link that says, "The process of paying off a debt, together with interest,
usually with equal payments at regular intervals over a period of time."

The box goes away when the user uses their mouse to move the cursor off the
link, or when they click a "close" link inside the box.

Has anyone managed to do this in an accessible way?

Thanks,
David Ashleydale