Latest Lists

How do I create a nested unordered list that can expand / collapse and is accessible?

Do you have any idea on how to create an accessible nested list in which each branch can be expanded / collapsed using JavaScript? I have tried inserting dummy links (which I know isn't good!), buttons, and images at each level that can trigger the expand/collapse but these have proved very confusing for screen reader users. Instead of hiding the menu using display:block/none, I tried positioning it off-screen, so that screen reader users could access the entire list at all times. This worked, but the trigger buttons I had inserted for sighted still caused confusion. Are you aware of an accessible ways in which to achieve this task, or can you point me in the direction of any website where this has been achieved successfully?

Public Comments

1. http://uk.search.yahoo.com/search?rd=r1&p=javascript+collapsible+menu