Крутящиеся кнопки на социальные сети

icon-sicial-knopkeЯ люблю анимацию и на многих блогах видела крутящиеся кнопки на социальные сети. Думала, что если найду как их устанавливать – обязательно установлю. И вот свершилось – найдена информация по установке. Спасибо Валерию Евсееву http://prokachay-wordpress.ru/ за нее. Если у вас есть желание установить такие кнопки, следуйте за мной.
Установка проста и понятна будет даже новичку. Привожу код установки, скопируйте его

</pre>
<style><!--
#social a:hover {background-color: transparent;opacity:0.7;} #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); }
--></style>
<pre></pre>
<center>
<div id="social">
<!--Start Rss Icon-->
<a title="Rss Feed" href="http://feeds.feedburner.com/dohod2011/SYvw" target="_blank">
<img style="margin-right: 1px;" alt="Icon" src="http://dohod2011.ru/wp-content/uploads/2014/06/Rss-1.png" width="30" height="30" border="0" /></a>
<!--End Rss Icon-->
<!--Start Email Rss Icon-->
<a title="Обновленияпо Email" href="http://feedburner.google.com/fb/a/mailverify?uri=dohod2011/YRUC&amp;loc=en_US"> target="_blank" rel="nofollow">
<img style="margin-right: 1px;" alt="Icon" src="http://dohod2011.ru/wp-content/uploads/2014/06/Email.png" width="30" height="30" border="0" /></a>
<!--End Email Rss Icon-->
<!--Start Facebook Icon-->
<a title="Facebook" href="https://www.facebook.com/natalija.sumina" target="_blank" rel="nofollow">
<img style="margin-right: 1px;" alt="Icon" src="http://dohod2011.ru/wp-content/uploads/2014/06/Facebook.png" width="30" height="30" border="0" /></a>
<!--End Facebook Icon-->
<!--Start Twitter Icon-->
<a title="Twitter" href="https://twitter.com/#!/sumina2012" target="_blank" rel="nofollow">
<img style="margin-right: 1px;" alt="Icon" src="http://dohod2011.ru/wp-content/uploads/2014/06/Twitter.png" border="0"width="30" height="30" / ></a>
<!--End Twitter Icon-->
<!--Start Google+ Icon-->
<a title="Google+" href="https://plus.google.com/u/0/106418094232074081295/posts" target="_blank" rel="nofollow">
<img style="margin-right: 1px;" alt="" src="http://dohod2011.ru/wp-content/uploads/2014/06/social_google_button_blue.png" width="30" height="30" /></a>
<!--End Google+ Icon-->
<!--StartVkontakte Icon-->
<a title="Vkontakte" href="http://vk.com/id179080675" target="_blank" rel="nofollow">
<img style="margin-right: 1px;" alt="" src="http://dohod2011.ru/wp-content/uploads/2014/06/social_google_button_blue.png" width="30" height="30" /></a>
<!--End VkontakteIcon-->
<!--Start Youtube Icon-->
<a title="Youtube" href="https://plus.google.com/u/0/117030139617830566650/" target="_blank" rel="nofollow">
<img style="margin-right: 1px;" alt="" src="http://dohod2011.ru/wp-content/uploads/2014/06/Youtube1.png" width="30" height="30" /></a>

<!--End Youtube Icon-->

</div>

</center>

<pre>

Синим цветом выделены названия социальных сетей, красным – ссылки и иконки, которые нужно заменить на свои. Затем вставляете этот код там где хотите видеть кнопки. У меня это правый сайт бар.
Ссылки вставляете на ваши странички и изображения берете у себя или на сайте https://www.iconfinder.com. Код предоставила на все сети, что установлены у меня, если нет желания установить все – просто удалите ненужное или наоборот добавьте свои.

Благодарна за оставленный комментарий или за информацию в социальных сетях.

Наталия Сумина

Наталия Сумина

About Наталия Сумина

Я - Наталия Сумина, хозяйка этого блога. Рада приветствовать Вас! Буду рада общению! Удачи!
Bookmark the permalink.

Понравилась информация? Оставьте Ваш комментарий