Difference between revisions of "ARIA Expanded state"

From Level Access Web Labs
Jump to navigation Jump to search
Line 27: Line 27:
 
   </section>
 
   </section>
 
   <section>
 
   <section>
     <a href="#" onclick="toggle(this);" id="a1" aria-expanded="false" aria-controls="p2" > SSB</a>
+
     <a href="#" onclick="toggle(this);" id="a1" aria-expanded="false" aria-controls="p2" > Level Access</a>
     <p class="hidden" id="p2">SSB BART Group is an digital accessibility solutions provider.</p>
+
     <p class="hidden" id="p2">Level Access is an digital accessibility solutions provider.</p>
 
   </section>
 
   </section>
 
   <body>
 
   <body>
Line 35: Line 35:
 
See also  [[ARIA Accordion]]
 
See also  [[ARIA Accordion]]
  
 +
==Notes==
 +
This example uses ARIA-Expanded and ARIA-Controls.
 +
 +
==Test Results==
 +
JAWS with internet Explorer, Firefox and Chrome The expanded and collapsed state are announced as expected. In Firefox and Internet Explorer the JAWS command INSERT+ALT+M moves the virtual cursor to the new content. This does not work in Google chrome.
 
[[Category: ARIA]]
 
[[Category: ARIA]]

Revision as of 16:10, 1 February 2018

Activate the button/link to expand them and set the aria-expanded state to true. Activate again to collapse.

See also ARIA Accordion

Notes

This example uses ARIA-Expanded and ARIA-Controls.

Test Results

JAWS with internet Explorer, Firefox and Chrome The expanded and collapsed state are announced as expected. In Firefox and Internet Explorer the JAWS command INSERT+ALT+M moves the virtual cursor to the new content. This does not work in Google chrome.