Comment vérifier si l'utilisateur est en mode de contraste élevé via JavaScript ou CSS

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

  •  20-09-2019
  •  | 
  •  

Question

Lorsque vous appuyez sur Maj + Gauche + Alt + Imprimer passe de Windows en mode contraste élevé - Y at-il chance de détecter que sur une page web (en utilisant JavaScript ou CSS)?

Est-il possible de détecter que dans le HTTP-Request (a.k.a le côté serveur, par exemple via PHP ou Ruby)?

Était-ce utile?

La solution

Selon cet article sur l'utilisation de CSS sprites de contraste élevé, en mode contraste élevé sous Windows, les images de fond doit être réglé sur « aucun » et il change aussi la couleur d'arrière-plan. Cela devrait passer outre toute feuille de style CSS. Ainsi, vous pouvez effectuer une javascript pour détecter après le rendu initial. Consultez son de démonstration (le texte "FYI [Non] en mode contraste élevé").

Je Mac (commutateur en utilisant votre information Cmd + Alt + Ctrl + 8) et sa technique ne fonctionne pas pour moi, mais il dit qu'il fonctionne sur Windows.

Si cela fonctionne, vous pouvez utiliser un peu de JavaScript pour changer simplement votre CSS ou définir un cookie (session) et recharger la page pour transmettre au serveur et effectuer des actions côté serveur.

Autres conseils

Les oeuvres suivantes pour moi sur Win8 avec (le bureau-) IE:

<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>

Je pense qu'il faut travailler avec des applications Windows Store ainsi. Ce n'est pas une solution complète, mais peut-être un peu utile.

MSDN doc: @media , -m-haut contraste . Le en mode haut contraste la description est également utile de mentionner.

Si vous implémentez un contraste élevé dans votre application Web puis utilisez après un bloc de code pour détecter la sélection en noir sur blanc et blanc sur noir contraste. Cela fonctionne bien dans IE.

écran @media et (-m-haut contraste: noir sur blanc) {  / *  Mettez votre code de style .............   * /   }

écran @media et (-m-fort contraste: blanc sur noir) {  / * Mettez votre code de style ............. * /   }

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top