Difference between revisions of "Aria-labelledby aria-hidden"
Jump to navigation
Jump to search
| (7 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
<html> | <html> | ||
| − | <p>aria-labelledby reference element with aria-hidden true</p> | + | <style> |
| − | + | div.box { | |
| − | + | border:thin solid black; | |
| − | + | margin: .5em; | |
| + | } | ||
| + | </style> | ||
| + | <body> | ||
| + | <div aria-hidden="false"> | ||
| + | <div class="box"> | ||
| + | <p>aria-labelledby reference element with aria-hidden true</p> | ||
| + | <a aria-labelledby="p1" href="http://www.google.com"> Google </a> | ||
| + | <p id="p1" aria-hidden="true"> Adobe </p> | ||
| + | <p>Accessible name for above should be "Adobe".</p> | ||
| + | </div> | ||
| + | <div class="box"> | ||
<p>aria-labelledby reference element with text and span with aria-hidden true</p> | <p>aria-labelledby reference element with text and span with aria-hidden true</p> | ||
<a aria-labelledby="p2" href="http://www.google.com"> Google </a> | <a aria-labelledby="p2" href="http://www.google.com"> Google </a> | ||
<p id="p2"> Adobe <span aria-hidden="true"> systems </span> </p> | <p id="p2"> Adobe <span aria-hidden="true"> systems </span> </p> | ||
<p>Accessible name for above should be "Adobe".</p> | <p>Accessible name for above should be "Adobe".</p> | ||
| + | </div> | ||
| − | <p>Link with text and span with aria-hidden true.</p> | + | <div class="box"> |
| + | <p>Link with text and span with aria-hidden true. aria-labelledby not used.</p> | ||
<a href="http://www.google.com"> Google | <a href="http://www.google.com"> Google | ||
<span aria-hidden="true"> Adobe </span></a> | <span aria-hidden="true"> Adobe </span></a> | ||
<p>Accessible name for above should be "Google".</p> | <p>Accessible name for above should be "Google".</p> | ||
| − | + | </div> | |
| + | <div aria-hidden="true"> | ||
| + | <p> This is some text inside</p> | ||
| + | </div> | ||
| + | </div> | ||
| + | </body> | ||
</html> | </html> | ||
Latest revision as of 19:38, 9 March 2019
aria-labelledby reference element with aria-hidden true
GoogleAccessible name for above should be "Adobe".
aria-labelledby reference element with text and span with aria-hidden true
GoogleAdobe
Accessible name for above should be "Adobe".
Link with text and span with aria-hidden true. aria-labelledby not used.
GoogleAccessible name for above should be "Google".
