Cómo comprobar si el usuario está en modo de alto contraste a través de JavaScript o CSS

StackOverflow https://stackoverflow.com/questions/1921047

  •  20-09-2019
  •  | 
  •  

Pregunta

Cuando se pulsa Mayúsculas + izquierdo + Alt + Imprimir Windows cambia en modo de contraste alto - ¿hay alguna oportunidad de detectar que en una página web (usando JavaScript o CSS)?

¿Hay alguna posibilidad de detectar que en el HTTP-Request (a.k.a el lado del servidor, por ejemplo, a través de PHP o Ruby)?

¿Fue útil?

Solución

De acuerdo con este artículo sobre el uso de CSS sprites en alto contraste , en el modo de alto contraste en Windows, imágenes de fondo deben ser ajustados a "None" y también cambia el color de fondo. Esto debería anular alguna hoja de estilo CSS. Para que pueda realizar algunos javascript para detectar después de la representación inicial. Compruebe su página de demostración (el "FYI [No] en el modo de alto contraste" de texto).

Tengo Mac (FYI conmutador mediante Cmd + Alt + Ctrl + 8) y su técnica no funciona para mí, pero él dice que funciona en Windows.

Si funciona, puede utilizar un poco de JavaScript para simplemente cambiar la CSS o establecer una cookie (sesión) y vuelva a cargar la página para pasarla al servidor y ejecutar acciones del lado del servidor.

Otros consejos

Las siguientes obras para mí en Win8 con (el tablero del escritorio), es decir:

<style type="text/css">
// ...
@media screen and (-ms-high-contrast: active) {
   /* any rules may come here, for example: */
   .leftMenu a:hover { text-decoration: underline; }
}
// ...
</style>

Creo que debe funcionar con Windows tienda de aplicaciones también. Esto no es una solución completa, pero un poco que puede resultar útil.

MSDN doc: @media , href="http://msdn.microsoft.com/en-us/library/windows/apps/hh465764.aspx" rel="nofollow"> -ms-alto contraste. El modo de alto contraste descripción es también digno de mención.

Si va a implementar un alto contraste en su aplicación web a continuación, utilizar siguiente bloque de código para la detección de negro sobre blanco Selección de contraste y en blanco sobre negro. Esto funciona bien en IE.

pantalla @media y (-ms-alto contraste: negro-en-blanco) {  / *  Ponga su código de estilo .............   * /   }

pantalla @media y (-ms-alto contraste: blanco sobre negro) {  / * Ponga su código de estilo ............. * /   }

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top