Главная » 2016 » Апрель » 10 » Вращающиеся соц. закладки (Скрипты для ucoz)
10.04.2016, 16:27

Вращающиеся соц. закладки





Представляем вашему вниманию вращающиеся соц. закладки для сайта. Если навести курсор на любую из таких иконок, то она повернется на 360 градусов. Основано все на свойстве rotate.

Приступим к установке:

1) Скачиваем архив и загружаем папку soc_icons, вместе с ее содержимым в корень своего сайта.

2) ПУ-->Управление дизайном-->Таблица стилей CSS. Добавляем эти строчки:

Код
/* Вращающиеся социальные иконки для uCoz */  
#social img {  
-moz-transition: all 0.8s ease-in-out;  
-webkit-transition: all 0.8s ease-in-out;  
-o-transition: all 0.8s ease-in-out;  
-ms-transition: all 0.8s ease-in-out;  
transition: all 0.8s ease-in-out;  
}  
#social img:hover {  
-moz-transform: rotate(360deg);  
-webkit-transform: rotate(360deg);  
-o-transform: rotate(360deg);  
-ms-transform: rotate(360deg);  
transform: rotate(360deg);  
}  
.social {text-align: center;margin: 10px;}  
/* InternetEmpire.Ru */


3) В то место на сайте, где вы хотите видеть иконки, вставляем этот код:

Код
<div id="social" class="social">  
<a target="_blank" rel="nofollow" href="http://vk.com">  
<img border="0" src="/soc_icons/vk.png"style="margin-right: 1px;" /></a>  
<a target="_blank" rel="nofollow" href="http://odnoklassniki.com">  
<img border="0" src="/soc_icons/o.png"style="margin-right: 1px;" /></a>  
<a target="_blank" rel="nofollow" href="http://fb.com">  
<img border="0" src="/soc_icons/fb.png"style="margin-right: 1px;" /></a>  
<a target="_blank" rel="nofollow" href="http://twitter.com">  
<img border="0" src="/soc_icons/t.png"style="margin-right: 1px;" /></a>  
<a target="_blank" rel="nofollow" href="https://plus.google.com">  
<img border="0" src="/soc_icons/gp.png"style="margin-right: 1px;" /></a>  
<a target="_blank" rel="nofollow" href="http://linkedin.com">  
<img border="0" src="/soc_icons/in.png"style="margin-right: 1px;" /></a>  
<a target="_blank" rel="nofollow" href="http://livejournal.com">  
<img border="0" src="/soc_icons/lj.png"style="margin-right: 1px;" /></a>  
<a target="_blank" rel="nofollow" href="http://youtube.com">  
<img border="0" src="/soc_icons/yt.png"style="margin-right: 1px;" /></a>  
<a target="_blank" rel="nofollow" href="#">  
<img border="0" src="/soc_icons/rss.png"style="margin-right: 1px;" /></a>  
</div>
Материал взят с сайта infoscript.ru
Теги: Скачать Вращающиеся соц. закладки
Скачать "Вращающиеся соц. закладки"
Внимание! Копирование данного материала запрещено без указания ссылки на сайт Infoscript.ru
Источник/Автор: internetempire.ru
Категория: Скрипты uCoz | Просмотров: 1664 | Добавил: antisept | Рейтинг: 4.0/1 |
Теги: закладки, соц., Вращающиеся
Пока комментариев нет. Ты можешь быть первым!
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]