Difference between revisions of "ARIA Pressed State"

From Level Access Web Labs
Jump to navigation Jump to search
Line 14: Line 14:
  
 
   <button id="b1" onclick="toggle('b1');" aria-pressed="true"> Bold </button>
 
   <button id="b1" onclick="toggle('b1');" aria-pressed="true"> Bold </button>
 
+
  <button aria-label="bold button my aria-label" id="b2" onclick="toggle('b2');" aria-pressed="true"> Bold (with aria-label) </button>
 +
  <p id="p1">Some label</p>
 +
  <button aria-labelledby="p1" id="b2" onclick="toggle('b2');" aria-pressed="true"> Bold (with aria-labelledby) </button>
 
   <p>Div element with aria-pressed and role button</p>
 
   <p>Div element with aria-pressed and role button</p>
  
Line 22: Line 24:
  
 
   <a role="button" onclick="toggle('a1');" id="a1" style="border:solid;" href="#" aria-pressed="true"> Underline </a>
 
   <a role="button" onclick="toggle('a1');" id="a1" style="border:solid;" href="#" aria-pressed="true"> Underline </a>
 +
 
</body>
 
</body>
 
</html>
 
</html>
 
[[Category:ARIA]]
 
[[Category:ARIA]]
 
[[Category:aria-pressed]]
 
[[Category:aria-pressed]]

Revision as of 13:14, 19 October 2015

Each control can be toggled to pressed or not pressed.

With button element

Some label

Div element with aria-pressed and role button

Italics

Anchor element with aria-pressed and role button

Underline