¿Se puede "bloquear" un lector de pantalla dentro de un elemento DIV?

Question

He escrito un sitio que usa jQuery para mostrar una ventana emergente modal. En esencia, cubre toda el área visible de la pantalla con una superposición, luego muestra un DIV que contiene la ventana emergente real en la parte superior de la superposición. Uno de los requisitos para este proyecto tiene que ver con la accesibilidad.

Hemos podido enfocarnos en el modal cuando aparece para que el lector de pantalla detenga lo que está haciendo y comience a leer dentro del modal. Sin embargo, nuestro problema actual es que una vez que el lector de pantalla de JAWS termina de leer el texto dentro de la ventana modal, continúa más allá y lee el texto fuera de la ventana (debajo de la plantilla).

¿Hay alguna manera de "bloquear" el lector de pantalla dentro de un elemento particular para que no pueda leer nada fuera de él?

Answer 1

Si se agrega un atributo de:

aria-disabled="true" 

al resto del margen de beneficio sitio después de ajustar el enfoque en el modal, se debe mantener a los lectores de pantalla de la lectura de ese contenido. Esto es más fácil de hacer si todo el otro contenido está en un DIV y el modelo se agrega al DOM como un hermano a ese DIV (por lo que solo necesitaría agregar ese atributo en un elemento).

De forma alternativa, si es posible con su cuadro de diálogo, podría agregar algo de tabulación JavaScript-presionar/enfocar detección para mantener al usuario en un bucle dentro de este cuadro de diálogo. Si no puede salir del diálogo con un teclado (excluyendo presionar un botón para cerrar/cancelar), debe ser accesible en general.