Difference between revisions of "Accessible name calc"
Jump to navigation
Jump to search
Image with aria-labelledby with multiple id refs/h2>
| Line 28: | Line 28: | ||
<div> | <div> | ||
<a class="pseudo" href="#"> click here </a> | <a class="pseudo" href="#"> click here </a> | ||
| + | <p>has an accessible name of "click here".</p> | ||
</div> | </div> | ||
| Line 33: | Line 34: | ||
<div> | <div> | ||
<a class="pseudo" href="#"></a> | <a class="pseudo" href="#"></a> | ||
| + | <p>has an accessible name of "".</p> | ||
</div> | </div> | ||
| Line 39: | Line 41: | ||
<a href="#" aria-labelledby="d1a"> click here </a> | <a href="#" aria-labelledby="d1a"> click here </a> | ||
<div id="d1a" class="pseudo"> pool </div> | <div id="d1a" class="pseudo"> pool </div> | ||
| + | <p>has an accessible name of "pool".</p> | ||
</div> | </div> | ||
Revision as of 15:31, 29 November 2016
Image with aria-label and alt
having an accessible name of “here”.
Image with space for aria-label and alt
having an accessible name of “ ”.
Image with null for aria-label and alt
having an accessible name of “hello”.
Image with aria-labelledby with multiple id refs/h2>
Hello
Here
Hello
Here
Link with pseudo content
click here
has an accessible name of "click here".
Link with only pseudo content
Link referencing aria-labelledby with pseudo content
Link referencing aria-labelledby with display none including children
click here
has an accessible name of "pool location"
Link referencing aria-labelledby with visibility hidden including children
click here
has an accessible name of "pool"
Link referencing parent with aria-labelledby
Massive storm sweeps across nation click here
has an accessible name of "Massive storms sweeps across nation click here"
