WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Using ARIA for styling?

for

From: Jonathan Avila
Date: Mar 6, 2017 8:12AM


> I'd like the menu item for the currently active page to have a different appearance within the menu. To kill two birds with



Vanessa, the aria-current<http://w3c.github.io/aria/aria/aria.html#aria-current>; attribute from ARIA 1.1 is the right attribute but the support with assistive technology is very limited at this time. Aria-selected is not the appropriate attribute and is not likely to be seen correct by assistive technology now or in the future.



Jonathan



Jonathan Avila

Chief Accessibility Officer

SSB BART Group

<EMAIL REMOVED>

703.637.8957 (Office)

Visit us online: Website | Twitter | Facebook | LinkedIn | Blog

See you at CSUN in March!



The information contained in this transmission may be attorney privileged and/or confidential information intended for the use of the individual or entity named above. If the reader of this message is not the intended recipient, you are hereby notified that any use, dissemination, distribution or copying of this communication is strictly prohibited.



-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Preast, Vanessa
Sent: Monday, March 06, 2017 7:05 AM
To: WebAIM Discussion List
Subject: [WebAIM] Using ARIA for styling?



I'm a novice when it comes to ARIA.



I'd like the menu item for the currently active page to have a different appearance within the menu. To kill two birds with one stone, I was thinking it would be nice to refer to the ARIA to change the appearance of menu items. Can I style based on whether the ARIA-selected is true or false? If so, what would that css code look like?



Here is some HTML code for a menu I'm working with right now for a menu:

<ul>

<li><a href="index.html" aria-selected="false">Home</a></li>

<li><a href="example1.html" aria-selected="false">Another Menu Item</a></li> <li><a href="example2.html" aria-selected="true">Current page</a></li> </ul>



Thanks,

Vanessa