Как проверить, если пользователь находится в режиме высокой контрастности с помощью JavaScript или CSS

Question

При нажатии Сдвига + левого + Alt + Print для Windows переключается в режим высокой контрастности - есть ли шанс обнаружить, что на веб-страницы (используя JavaScript или CSS)?

Есть ли вероятность обнаружить это в HTTP-Request (a.k.a на стороне сервера, например, через PHP или Ruby)?

Answer 1

В соответствии с this article about using CSS sprites in high contrast, в режиме высокой контрастности в Windows фоновое изображение должно быть установлено на «none», а также меняет цвет фона. Это должно переопределить любую таблицу стилей CSS. Таким образом, вы можете выполнить некоторый javascript, чтобы обнаружить его после первоначального рендеринга. Проверьте его demo page (текст «FYI [Not] in high contrast mode»).

У меня есть Mac (переключатель FYI с использованием Cmd + Alt + Ctrl + 8), и его техника не работает для меня, но он говорит, что он работает в Windows.

Если это сработает, вы можете использовать какой-либо JavaScript, чтобы просто изменить свой CSS или установить (сессионный) cookie и перезагрузить страницу, чтобы передать ее на сервер и выполнить действия на стороне сервера.

Answer 2

Следующие работы для меня на Win8 с (в desktop-) 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> 

Я думаю, что он должен работать с Windows Store приложения, а также. Это не полное решение, но, возможно, полезно немного.

MSDN документ: @media, -ms-high-contrast. описание High-contrast mode описание также стоит упомянуть.

Answer 3

Если вы выполняете высокую контрастность в своем веб-приложении, используйте следующий блок кода для определения контраста черного и белого и белого цветов. Это будет отлично работать в IE.

@media экран и (-ms-высококонтрастный: черно-на-белом) { /* Положите ваш стиль код ............. */ }

@media экран и (-ms-высококонтрастный: белое на черном) { /* Положите ваш стиль код ............. */ }