Роль социальных сетей - Facebook,
Twitter, Вконтакте, Google+ ....... нельзя игнорировать. Уже сегодня
сложно найти сайт или блог без социальных плагинов, дизайн которых
становится все более оригинальным. Наткнувшись на 3D социальные иконки с эффектом вращения, не
смогла пройти мимо. И хоть с сайдбаре уже был установлен комплект
иконок, решила поиграться с новыми. Если навести курсор, иконки начинают
вращаться и рука сама тянется кликнуть на мышку.
Код иконок позаимствовала у Сергея Мазураша.
<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> <center> <div id="social"> <a href="http://feeds.feedburner.com/blogspot/veraborok" rel="nofollow" target="_blank" title="Rss Feed"><img alt="Icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4he1O9CrdM9S86vnDKa3XeUfvI9yGUx0lMX_Q3v0yRI0FhK9c94OmnMAusr_KqzMHJakWP8ram0xh9VtFc8YdDpwmYfIlmCmf4SSoRtYLFiXJPnvFmeQL35xdgibKBw9D_H76mrRXJtc/s1600/RSS-48x48.png" style="margin-right: 1px;" /></a> <a href="http://feedburner.google.com/fb/a/mailverify?uri=blogspot/MbbDy&loc=ru_RU" rel="nofollow" target="_blank" title="Получать свежие статьи на Email"><img alt="Icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpWXjzwm2sLoObcxM63JziKP8OYxdR1OxTbQrU7py-yaT5R5QaugAKiRt9jq1si8CPEd_whavNbEThdrNLp6AsLZL-pPA5m0Ght2h5nf1GQhBaSvWPDq5NM-UsJJgz6LH04fKEP4mXcGo/s1600/RSS-EMAIL-48.png" style="margin-right: 1px;" /></a> <a href="https://www.facebook.com/vera.borok" rel="nofollow" target="_blank" title="Facebook"><img alt="Icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgguoWIM2ArjU4OqmlqN5BSd1b3rBpa2gWZ8_O2CoEoyXZelkkTv8-Ky6rREMtXHqbxSOF0aYnZxZqJIJAlqSC05lyDFZlwNS46iOMLJQiYHKHpPnc-VbIHnvbkkdKCni1VmkMEJ9ZM1bQ/s1600/FACEBOOK-48x48.png" style="margin-right: 1px;" /></a> <a href="https://twitter.com/#!/Vera_Borok" rel="nofollow" target="_blank" title="Twitter"><img alt="Icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPQ6voG9pI-jt1hP5OtaFqqmbM9KgYLQMcrSZOEUD0seAch_H87yqSBPv4WV9qzIf7FiHefJt1T9GrFx6IYmOzXeCvHW2qgbvsp-0gzHVrjPmX5MflLYxV_lHPdFgt1sUceHrCHVfc7Qs/s1600/TWITTER-48x48.png" style="margin-right: 1px;" /></a> <a href="https://plus.google.com/101319911733376498080/posts" rel="nofollow" target="_blank" title="Google+"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgJfwXD24q69Bz7xZT5luwxcu3RxjvQYJ1lQ1AXbEMHVPw90o6oosfBxFrdmKtsZWdWuwdSnPIXCLkAfc4NzFrmuuQ50knMG9WkM4MD3IxpsuCz2yZIIXvU91wotWNoT2CEfGN5X59CJ0/s1600/GOOGLE-PLUS-48x48.png" style="margin-right: 1px;" /></a> </div> </center>
Установить легко: "Дизайн" -- "Добавить гаджет" -- "HTML/JavaScript" -- код гаджета.
Только мои адреса профилей соцсетей и RSS канала поменяйте на свои.
Сохраняем и перетягиваем гаджет, лучше повыше. Еще раз сохраняем.
Источник
Спасибо за новинки, попробую установить
ОтветитьУдалить