Социальные иконки выезжают для uCoz
Уже трудно представить сайт, на котором нет социальных закладок. Здесь только Русский набор кнопок, которые при наведение клика выезжают и появляются полностью. Теперь вам не нужно рисовать их или создавать, все готовый для этого скрипт есть. Вы можете его разместить, так где вы сами хотите или видите. Сам он не сложный, только нужно скачать папку и закинуть в корень сайта и прописать код. Там где видите на сайте их. Код <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> Вставьте в таблицу стилей 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; } Но для начало, загрузку производим, скачиваем архив и все в папку soc_icons корень сайта, если нет такой, то создается. Источник: Internetempire.ru |
Поделиться в социальных сетях
Материал разместил
Комментарии: 7 | |
| |