Difference between revisions of "Modal dialog with ARIA"

From Level Access Web Labs
Jump to navigation Jump to search
(Example)
(Add aria-modal attribute)
Line 81: Line 81:
 
   </div>
 
   </div>
  
   <div role="dialog" tabindex="-1" id="dialog1" aria-labelledby="dialog1Title" aria-describedby="dialog1Desc" class="dialog-hide">
+
   <div role="dialog" tabindex="-1" id="dialog1" aria-labelledby="dialog1Title" aria-describedby="dialog1Desc" aria-modal="true" class="dialog-hide">
 
     <!-- Mark the end of the dialog for browsers/AT which don't support ARIA -->
 
     <!-- Mark the end of the dialog for browsers/AT which don't support ARIA -->
 
     <span aria-hidden="true" class="sr-only"> Beginning of modal dialog </span>
 
     <span aria-hidden="true" class="sr-only"> Beginning of modal dialog </span>

Revision as of 19:37, 17 November 2016

Example

Note - not implemented:

  • Constraining keyboard focus within the modal dialog


...

...