Difference between revisions of "ARIA Radio and Radiogroup"

From Level Access Web Labs
Jump to navigation Jump to search
(Created page with "<html lang="en"> <head> <title>ARIA Radio and Radiogroup Example</title> </head> <body> <p>The following is a sample of using the ARIA radio and radiogroup roles.<br /> <h3 id...")
 
Line 5: Line 5:
 
<body>
 
<body>
 
<p>The following is a sample of using the ARIA radio and radiogroup roles.<br />
 
<p>The following is a sample of using the ARIA radio and radiogroup roles.<br />
<h3 id="rg1_label">Lunch Options</h3>
+
<div id="radio_label">My radio label</div>
<ul class="radiogroup" id="rg1"  role="radiogroup" aria-labelledby="rg1_label">
+
<ul role="radiogroup" aria-labelledby="radio_label">
  <li id="r1"  tabindex="-1" role="radio" aria-checked="false">
+
<li role="radio">Item #1</li>
    <img role="presentation" src="radio-unchecked.gif" /> Thai
+
<li role="radio">Item #2</li>
  </li>
+
<li role="radio">Item #3</li>
  <li id="r2"  tabindex="-1" role="radio"  aria-checked="false">
 
    <img role="presentation" src="radio-unchecked.gif" /> Subway
 
  </li>
 
  <li id="r3"  tabindex="0" role="radio" aria-checked="true">
 
    <img role="presentation" src="radio-checked.gif" /> Radio Maria
 
  </li>
 
 
</ul>
 
</ul>
 
</p>
 
</p>

Revision as of 15:02, 28 March 2014

ARIA Radio and Radiogroup Example

The following is a sample of using the ARIA radio and radiogroup roles.

My radio label
  • Item #1
  • Item #2
  • Item #3