- PVSM.RU - https://www.pvsm.ru -
На форуме Stackoverflow обсуждают [1], как сделать PNG, который будет по-разному выглядеть в разных браузерах. Например, картинка вверху выглядит как груша в Chrome/Firefox, но «превращается» в яблоко в браузере IE.
Рецепт простой. Всё дело в гамма-коррекции [2], которая учитывается в одних браузерах и не учитывается в других браузерах. Чтобы эксплуатировать эту разницу, мы берём две картинки: яблоко и грушу. Грушу помещаем в светлые пикселы PNG.
Яблоко — в тёмные пикселы PNG. Яркость нужно настроить так, что при затемнении груша становится хорошо видна, а яблоко затемняется полностью. И наоборот, при максимальном осветлении груша практически исчезает, а яблоко хорошо видно.
Совмещаем два изображения, так что светлые и «тёмные» пикселы чередуются шахматкой — и готово. Теперь, если браузер включает гамма-коррекцию, то на экране появляется груша. А если просто сохранить картинку на десктоп и открыть в редакторе, то видно яблоко.
P.S. Ещё один пример [3]: в браузерах с гамма-коррекцией отображается эмблема GNU, а в старом IE или Opera — цветной пингвин.
Автор: alizar
Источник [4]
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/png/31419
Ссылки в тексте:
[1] обсуждают: http://stackoverflow.com/questions/15858586/why-does-this-png-image-display-differently-in-chrome-firefox-than-in-safari-a
[2] гамма-коррекции: http://hsivonen.iki.fi/png-gamma/
[3] Ещё один пример: http://i.imgur.com/36EgeOF.png
[4] Источник: http://habrahabr.ru/post/175757/
Нажмите здесь для печати.