| Recipe 9 | Accessible Expand and Collapse |
Problem
When we need to present long, categorized lists on a website, the best way to do it is with nested, unordered lists. However, with this kind of layout, it can be hard for users to quickly navigate, or even comprehend, such a large list. Anything we can do to assist our users will be appreciated. Plus, we want to make sure that our list is accessible in case JavaScript is disabled or a user is visiting our site through a screen reader.
Ingredient
-
jQuery
Solution
A relatively easy way to organize a nested list, without separating the categories into different pages, is to make the list collapsible. This means that entire sections of the list can be hidden or displayed to better convey selective information. ...
Get Web Development Recipes, 2nd Edition now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
