Страница 1 из 11
Форум про uCoz » Все для вебмастера » Начинающий Вебмастер » Как сделать прозрачный баннер или счетчик
Как сделать прозрачный баннер или счетчик
Kosten
Дата: Четверг, 29.06.2017, 02:48 | Сообщение # 1
Администраторы
Сообщений:15257
Награды: 49


Здесь вы можете сделать прозрачным баннеры или счетчики, что будут еле просматриваемые. Думаю многие видели такой эффект на любом сайте, где счетчик но больше все баннеры идут не яркие в сделаны под фон сайта или его дизайн.

Устанавливаем код-css у себя в конец вашего CSS:

Код
/* ----////// Эффект прозрачности /////------- */    

#banners a img {    
opacity:0.3; -moz-opacity:0.3; filter:alpha(opacity=30);    
}    

#banners a:hover img {    
opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);    
}  


Заключаем счётчики или любое изображение,баннеры в дивы:

Код
<div id="banners">Тут ваши счётчики</div>
Страна: (RU)
-SAM-
Дата: Четверг, 29.06.2017, 03:30 | Сообщение # 2
Проверенные
Сообщений:234
Награды: 14


Еще к стилям прописывают скрипт для достижения эффекта плавного перехода прозрачности:
Код
<script>
   jQuery(function(){
   $("#banners img").hover(function(){
   $(this).stop().animate({opacity:'1.0'})},
   function(){$(this).stop().animate({opacity:'.3'})}
   );
   });
</script>

Правда, в наше время с появлением CSS3 вместо скрипта можно использовать свойство transition, чтобы была плавная трансформация.




Сообщение отредактировал
-SAM- - Пятница, 30.06.2017, 00:13
Страна: (UA)
Kosten
Дата: Четверг, 29.06.2017, 04:14 | Сообщение # 3
Администраторы
Сообщений:15257
Награды: 49


-SAM-, от души за дополнение + подарок!
Страна: (RU)
Форум про uCoz » Все для вебмастера » Начинающий Вебмастер » Как сделать прозрачный баннер или счетчик
Страница 1 из 11
Поиск: