Difference between revisions of "ARIA Pressed State"

From Level Access Web Labs
Jump to navigation Jump to search
Line 5: Line 5:
 
   alert('jon');
 
   alert('jon');
 
     var attr = document.getElementById(eID).getAttribute('aria-pressed');
 
     var attr = document.getElementById(eID).getAttribute('aria-pressed');
     document.getElementById(eID).setAttribute('aria-pressed', (attr=='true' ? 'false' : 'true' );
+
     document.getElementById(eID).setAttribute('aria-pressed', (attr=='true') ? 'false' : 'true' );
 
   }
 
   }
 
</script>
 
</script>
 
</head>
 
</head>
 
<body>
 
<body>
<p>With button element</p>
+
  <p>With button element</p>
<button id="b1" onclick="toggle('b1');" aria-pressed="true"> Bold </button>
+
 
<p>Div element with aria-pressed</p>
+
  <button id="b1" onclick="toggle('b1');" aria-pressed="true"> Bold </button>
<div onclick="toggle('d1');" id="d1" style="width:3em; border:solid;" aria-press="true" tabindex="0"> Italics </div>
+
 
<p>Anchor element with aria-pressed</p>
+
  <p>Div element with aria-pressed and role button</p>
<a onclick="toggle('a1');" id="a1" style="border:solid;" href="#" aria-pressed="true"> Underline </a>
+
 
 +
  <div role="button" onclick="toggle('d1');" id="d1" style="width:3em; border:solid;" aria-press="true" tabindex="0"> Italics </div>
 +
 
 +
  <p>Anchor element with aria-pressed and role button</p>
 +
 
 +
  <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 22:58, 8 July 2014

With button element

Div element with aria-pressed and role button

Italics

Anchor element with aria-pressed and role button

Underline