Отзывчивый дизайн. Реакция на уровень освещенности

[usualdesigner]

Поигрался с демо на телефоне.

[Paul_King]

Очень содержательный комментарий, спасибо)

[Mezomish]

Вы вкладкой ошиблись, твиттер не здесь.

[ksupipr]

Держите нас в курсе, мы волнуемся.

[ange007]

Может добавите в демке ползунки для «эмулирования»?
А то выходит для того чтоб посмотреть демку — нужно установить ФФ на телефоне, найти статью, и перейти по ссылке.

[Envek]

Так же работает на ноутбуках, оснащённых датчиками света. Например на макбуках с макосью.

Реагирующая на свет веб-страница произвела небольшой локальный фурор среди коллег.

[Anonym]

А в каких браузерах?
Проверил последние Chrome, FF, Safari — страница не реагирует на освещенность, а в FF еще и трекбар не работает.
UPD: FF не до конца обновился. В версии 28 всё заработало.

[Envek]

У меня работало в 27-м файрфоксе.

[vasili4]

в хроме работает даже, фонариком айфона посвети в область камеры макбука.

только вот у меня фон не становился белым даже при прямой наводке фонаря в камеру.

[Anisotropic]

А оформить как перевод? И дать ссылку на оригинал? girliemac.com/blog/2014/01/12/luminosity/
И я уже переводил эту статью на русский. Но на хабре не публиковал, всё-таки кросс-постинг нло не приветствуется…

[SergeyKuzmich]

Видать потому, что это не перевод все же, а сборка из материала из нескольких ресурсов. И я прекрасно понимаю что нужно указывать первоисточники, но в данном случае, думаю, указывать иные блоги, где есть подобные статьи, не стоит из-за их количества. Ссылки на документы и спецификации даны.
Нет я все же не претендую на 100% уникальный контент.

[Anisotropic]

У вас не сборка из нескольких ресурсов, а выжимка одной статьи плюс переделанная демка. В коде в этом посте в одном месте класс изменён с dim на dark. Я же дал ссылку на первоисточник, с которого вы всё это взяли.

[jeppeQue]

Серёжа молодец! Не занимайся копипастией.

[ElleSolomina]

В демо отлично показан принцип! Вот если туда ещё более плавное изменение* добавить вместо жёстких переходов, будет вообще сказка.

* не на каждый шаг конечно, но уровней надо явно побольше чем 3, по моим прикидкам, хотя бы 10, а на деле может и побольше.

[SergeyKuzmich]

В данной демке приведен пример реализации запланированной возможности в CSS Media Queries 4. В ней же представлено три вида отображения dim, normal и washed. Единственное что можно сгладить это переходы между состояниями.

[Iforgot]

Считаю, что эту задачу (контраст отображения) должно выполнять устройство, а не контент в устройстве.