cara membuat efek hover social profile pada blog

Sore gan,mumpung sore2 gini enaknya ya ngeblog.tapi ane hampir aja kehabisan ide.untungnya saya menemukan script keren hasil googling saya yaitu efek hover pada social profile yang pastinya keren dah.nanti coba sendiri ya...

oke kita langsung menuju ke tutorialnya :

1. masuk ke blogger
2. pilih tata letak

     3.pilih tambah gadget

     4.pilih HTML/JavaScript

     5.lalu copy kode dibawah ini

<style> .SlidingSocial a{float:left;display:inline;margin-right:8px} .SlidingSocial a:hover{-webkit-opacity:1;-moz-opacity:1;opacity:1} .SlidingSocial a{display:block;width:32px;height:32px;text-indent:-9999px;background-color:none;background:transparent url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWlkXoZkByBOAyZEB81vSiwA9AROlkjVEwVF57GlvXYQ_gxPsuHfKeIJ-7C8t5QPDtF28HfCuB7GQTeVhuWy8GJqLar9DMvY8wqFK7B1JMklY6vWXwBPdHM_amm7IONibn3XT9R4b_MJ8/s164/SlidingSocial.png") 0 0 no-repeat;-xwebkit-opacity:.7;-xmoz-opacity:.7;xopacity:.7;-webkit-transition:all .2s ease;-moz-transition:all .2s ease;-ms-transition:all .2s ease;-o-transition:all .2s ease;transition:all .2s ease} #iconTwitter{background-position:-33px -33px} #iconTwitter:hover{background-position:-33px 0} #iconFacebook{background-position:-66px -33px} #iconFacebook:hover{background-position:-66px 0} #iconRSS{background-position:0 -33px} #iconRSS:hover{background-position:0 0} #iconYouTube{background-position:-99px -33px} #iconYouTube:hover{background-position:-99px 0} #iconGooglePlus{background-position:-132px -33px} #iconGooglePlus:hover{background-position:-132px 0} </style> <div class="SlidingSocial"> <a href="http://feeds.feedburner.com/heroesman" id="iconRSS" target="_blank" title="RSS Feed">RSS</a> <a href="http://twitter.com/heroesman" id="iconTwitter" target="_blank" title="Twitter">Twitter</a> <a href="http://www.facebook.com/heroesman" id="iconFacebook" target="_blank" title="Facebook Page">Facebook</a> <a href="http://www.youtube.com/heroesman" id="iconYouTube" target="_blank" title="YouTube Channel">YouTube</a> <a href="https://plus.google.com/heroesman" id="iconGooglePlus" target="_blank" title="Google Plus">Google+</a> </div>

NB:ganti kata "heroesman" dengan nama akun agan masing2

Nanti hasilnya kaya gini :

RSS Twitter Facebook YouTube Google+

Gimana gan,keren gak?silahkan dicoba gan!

sekian postingan ane kali ini.jangan lupa untuk baca postingan yang lain..