Эффект прозрачности баннеров, изображений для Joomla

Автор: garosh.
Опубликовано 3 января 2014
в рубрике Joomla

Просмотров: 2584.
Подписаться на комментарии по RSS.
Эффект прозрачности баннеров, изображений для Joomla
Часто на сайтах можно увидеть изображения, баннеры, счетчики рейтингов с полупрозрачным эффектом и при наведении курсора становились обычными. Как этого добиться? В сегодняшней статье мы разберемся как это сделать. Все достаточно просто.

Итак, вот один из способов:

Эффект прозрачности баннеров, изображений для Joomla
Находим файл template.css в шаблоне сайта и изменяем код, в конец файла добавляем:

#banners a img
{
opacity:0.3; -moz-opacity:0.3; filter:alpha(opacity=40);
}
#banners a:hover img
{
opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);
}
Вот так должен выглядеть код:

Эффект прозрачности баннеров, изображений для Joomla
Уровень прозрачности можно задавать от 0.1 до 0.9, чем ближе к 1.0 тем менее прозрачное.

Вообще, правило прозрачности можно ко всему что хочется применить. Даже к определенному правилу текста. Например к ссылкам или картинкам.

Далее, код самого баннера или изображения обрамляем в следующее:

<div id="banners">здесь код баннера, картинки и т.п.</div>
Все, теперь у Вас есть эффект полупрозрачности.

Напоследок, видео от меня:

twitter.com facebook.com vkontakte.ru odnoklassniki.ru mail.ru ya.ru yandex.ru

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

Гость
Комментатор / хотите им стать

Чтобы стать комментатором введите email и пароль. Напишите комментарий. В дальшейшем ваша связка email-пароль, позволит вам комментировать и редактировать свои данные. Не забудьте про активацию (инструкция придет на ящик, указанный при регистрации).

grin LOL cheese smile wink smirk rolleyes confused surprised big surprise tongue laugh tongue rolleye tongue wink raspberry blank stare long face ohh grrr gulp oh oh downer red face sick shut eye hmmm mad angry zipper kiss shock cool smile cool smirk cool grin cool hmm cool mad cool cheese vampire snake excaim question