WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Alternatives to a custom listbox

for

Number of posts in this thread: 4 (In chronological order)

From: jeffgutsell
Date: Fri, Feb 02 2024 11:01AM
Subject: Alternatives to a custom listbox
No previous message | Next message →

Hi All,
A developer friend has quizzed me bout creating a custom popup listbox that needs to contain images next to each text option. I pointed him to the W3 authoring guidelines page on listboxes as well as the whatsock.com site.

But I got to thinking that this widget apparently will only have a handful of options. So I am wondering whether there would be a problem with just putting a standard radio buttons group in a <div> popup?I am not sure exactly what the options will be. He just said this would have been perfect for a <select> control accept for the need for pictures.

Jeff Gutsell

From: Steve Green
Date: Fri, Feb 02 2024 11:39AM
Subject: Re: Alternatives to a custom listbox
← Previous message | Next message →

You could do that as long as you add the appropriate ARIA attributes and keyboard event handlers. I generally recommend using <details> and <summary> elements because all the accessibility requirements are baked-in and no JavaScript is needed.

Steve Green
Managing Director
Test Partners Ltd


From: Laurence Lewis
Date: Fri, Feb 02 2024 2:05PM
Subject: Re: Alternatives to a custom listbox
← Previous message | Next message →

Hi Jeff

This is purely experimental, but a Popover could work. The functionality
enables creating a popover that expands to a list of options with image and
text. It displays a detailed view with a larger image and description when
a link in the popover container is clicked..

Working example on Codepen
https://codepen.io/Deafinitive/live/OJqZRYK

From: jeffgutsell
Date: Fri, Feb 02 2024 2:49PM
Subject: Re: Alternatives to a custom listbox
← Previous message | No next message

Thanks, Lawrence and Steve,
I will look into both ideas tomorrow.
Some background: My friend was doing C++ projects when I worked with him in the 90s. After I retired, I learned that he was doing Web work and complained bitterly about being told to make an accessible navigation menu. I showed him how to make that more or less painless and he has gradually gravitated to the cause
I enjoy keeping him moving in the right direction.

Jeff