Эффект прозрачности или полупрозрачности, основанный на CSS можно применять в двух основных вариантах. Это исходное изображение при наведении на которое становится полупрозрачным. И полупрозрачное изображение при наведении становится истинным. Последний эффект часто применяют к баннерам
Рассмотрим пример кода проявления прозрачности при наведении на картинку
В таблицу стилей прописываем класс transh и расписываем его
Код
.transh a:hover img {
-moz-opacity: 0.5;
opacity: 0.5;
filter: alpha(opacity=50);
}
После этого любое изображение на которое нужно наложить эффект заключаем в div с прописанным классом trans
Код
<div class="transh">Тут прописываем адрес картинки или картинок</div>
Пример кода полупрозрачной картинки при наведении которая становится истинной
В таблицу стилей прописываем класс trans и расписываем его
Код
.trans a img {
opacity:0.5;
-moz-opacity:0.5;
filter:alpha(opacity=50);
}
.trans a:hover img {
opacity:1.0;
-moz-opacity:1.0;
filter:alpha(opacity=100);
}
В коде на страницах нужные картинки берем в div с указанием класса trans
Код
<div class="trans">Тут будут находится ваши изображения к которым нужно применить эффект</div>
значения Код
opacity:0.5; и filter:alpha(opacity=50)
