Осветление и затемнение картинки при наведении

17 Фев 2015 / Автор: v.knyazev / Рубрика: Записки / Ваш отзыв

Осветление и затемнение картинки при наведении с помощью CSS без скриптов делаем за два шага.

1. Добавить в CSS файл:

/*Осветление картинок при наведении*/
#imgosv a img, #imgosv img {opacity:0.3;}
#imgosv a img:hover, #imgosv img:hover {opacity:1.0;}


/*Затемнение картинок при наведении*/
#imgzat a img, #imgzat img {opacity:1.0;}
#imgzat a img:hover, #imgzat img:hover {opacity:0.3;}

2. Картинки разместить между div со специальным стилем:

<div id="#imgosv"><img alt="" /></div>

или

<div id="#imgzat"><img alt="" /></div>

Оставить комментарий