регистрация
856материалов
3260комментариев
227тем на форуме
6729пользователей

Выезжающие социальные иконки для uCoz


Описание:

Социальные сети захватили сознание людей и коснулись практически всех сфер жизни. Тяжело представить себе сайт без социальных кнопок и иконок. Совсем не обязательно создавать иконки с нуля, в просторах интернета есть большое количество готовых вариантов. Сегодня мы предлагаем вашему вниманию не большой скрипт русскоязычных социальных сетей, которые будут выезжать при наведении. На данный момент присутствую иконки: ВКонтакте, Twitter, Google+, Facebook, Одноклассники, Linkedin, Youtube и иконка RSS, но пожеланию вы можете добавить и свои.

Установка:

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

2. Вставьте в таблицу стилей CSS данный код:
Код
.menu {    
    text-align: center;    
    height: 60px;    
    overflow: hidden;    
    cursor: default;    
}    
       
.menu i {    
    position: relative;    
    top: 30px;    
    transition: .2s ease;    
}    
       
.menu i:hover {    
    top: 9px;    
}    
.icon {    
    border-radius:10px;    
}

3. Разместите этот HTML код в том месте где вы хотите видеть социальные иконки:
Код
<div class="menu">    
<i><a href="адрес ссылки" ><img src="/soc_icons/vkontakte.png" alt="Vkontakte"class="icon"></a></i>    
<i><a href="адрес ссылки" ><img src="/soc_icons/twitter.png" alt="Twitter"class="icon"></a></i>    
<i><a href="адрес ссылки" ><img src="/soc_icons/google_plus.png" alt="Google"class="icon"></a></i>    
<i><a href="адрес ссылки" ><img src="/soc_icons/facebook.png" alt="Facebook"class="icon"></a></i>    
<i><a href="адрес ссылки" ><img src="/soc_icons/odnoklassniki.png" alt="Ok"class="icon"></a></i>    
<i><a href="адрес ссылки" ><img src="/soc_icons/linkedin.png" alt="Linkedin"class="icon"></a></i>    
<i><a href="адрес ссылки" ><img src="/soc_icons/youtube.png" alt="Youtube"class="icon"></a></i>    
<i><a href="адрес ссылки" ><img src="/soc_icons/rss.png" alt="Rss"class="icon"></a></i>    
</div>


Скрипт опубликовал:
...
Логин на сайте: ...
Группа: ...
Статус: ...
Информация о скрипте:
Дата добавления материала: 11.01.2016 в 09:00
Материал просмотрен: 1972 раза
Категория материала: Скрипты для uCoz
К материалу оставлено: 11 комментариев

Пожаловаться
Сказать спасибо
Источник

11 комментариев


TheGamer
MaxiMus @TheGamer 11.01.2016 10:041
+6
Весьма хорошая и красивая вещь респект автору
tps
Александр @tps 11.01.2016 14:282
+3
Спасибо за кнопки
sergeeff
Красиво, а кнопки можно на свои изменить?
YaVi
Виктор @YaVi 11.01.2016 16:344
+1
Да, можно)
sergeeff
А их лучше одинаковыми по размеру сделать или одного?
YaVi
Виктор @YaVi 12.01.2016 05:236
+1
Лучше всего делать одинаковые размеры)
LANIGIRO
У меня что-то не пашет((( Беда(
Ромчик
ссылку на сайт в студию где установлен скрипт
YaVi
Виктор @YaVi 12.01.2016 18:129
0
А вы все правильно установили? можно сайт где установлено
LANIGIRO
Цитата Ромчик
ссылку на сайт в студию где установлен скрипт

я удалил этот скрипт(((
1 2 »
avatar
Хотите сайт всего за 10 дней?
Создать сайт вместе с uKit.com
Статистики нашего сайта
Сегодня к нам присоединился: 1 человек
Пользователи и гости сейчас онлайн: 5 Сегодня наш портал посетили: чел
Сейчас на сайте: AmiKus
Правила чата
Пользователи онлайн
Закрыть мини-чат
+Открыть мини-чат
0
Онлайн всего: 5
Гостей: 4
Пользователей: 1