Animated Social Media Icons effect water for blogger
bagus untuk mempercomel blog ente,..
silahkan terapkan di blognya sekarang,..cekidot
* bukalah blog you
* pilih template
* edit HTML
* cari kode ini ]]></b:skin>
* dan copy kode dibawah kemudian letakkan diatas kode ]]></b:skin>
.social-wrap {
margin:0px 0px 0px 0px;
padding:0px 0px 0px 0px;
}
.social-wrap ul li{
list-style:none;
border-bottom:none;
margin:0px 0px 0px 0px;
padding:0px 0px 0px 0px;
}
.social-wrap li a {
margin:5px 5px 0px 5px;
padding:0px 0px 0px 0px;
width:60px;
height:60px;
float:left;
text-indent:-99999px;
background: #191919;
border:solid 1px #222121;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright:5px;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-bottom-right-radius:5px;
border-top-left-radius:5px;
border-top-right-radius:5px;
border-bottom-left-radius:5px;
border-bottom-right-radius:5px;
}
.social-wrap li a.facebook {
background: #191919 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi601_Tc9DB_LBVihlDzl86fu-gl0ErBp-kmUR62zrImeImEGbdjQiRXaewciWV4XOjhKounBY0CVFO90pURDLOm66_37AlYngoObCert5Hz6zuU2YO79oy68SnPcpoGkpCOhzsaIKRrA/s1600/facebook.png) no-repeat -0px -88px;
-webkit-transition:All 0.3s ease-out;
-moz-transition:All 0.3s ease-out;
-o-transition:All 0.3s ease-out;
}
.social-wrap li a.facebook:hover {
background: #191919 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi601_Tc9DB_LBVihlDzl86fu-gl0ErBp-kmUR62zrImeImEGbdjQiRXaewciWV4XOjhKounBY0CVFO90pURDLOm66_37AlYngoObCert5Hz6zuU2YO79oy68SnPcpoGkpCOhzsaIKRrA/s1600/facebook.png) no-repeat -0px -0px;
}
.social-wrap li a.twitter {
background: #191919 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-0mCL-WP6usWQEkUMnHCsdsp2IbleVqMqGM8cleZxfTCOjnH921V2JgHnvm4VCtDrDW6qT5T73WUZGdVPqgRQpBB3KDc0E92zbxXcsMEq-7bAKxiUbiFzMtch1-plcJrTB_oyDrr9LA/s1600/twitter-1.png) no-repeat -0px -88px;
-webkit-transition:All 0.3s ease-out;
-moz-transition:All 0.3s ease-out;
-o-transition:All 0.3s ease-out;
}
.social-wrap li a.twitter:hover {
background: #191919 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-0mCL-WP6usWQEkUMnHCsdsp2IbleVqMqGM8cleZxfTCOjnH921V2JgHnvm4VCtDrDW6qT5T73WUZGdVPqgRQpBB3KDc0E92zbxXcsMEq-7bAKxiUbiFzMtch1-plcJrTB_oyDrr9LA/s1600/twitter-1.png) no-repeat -0px -0px;
}
.social-wrap li a.google-p {
background:#191919 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0BIPde2ThUW5clqWLjz9LkLb7nf_9UpsEZ8SzBLdtc-m93gROnIy280n5SykBpjh5Iebdj1clwxKNeuPA96kTmKvL5dp3temUxqGoujXjYKaOLWuFscezBeXXqW5i5tcMtKjk0a4WRA/s1600/google.png) no-repeat -0px -88px;
-webkit-transition:All 0.3s ease-out;
-moz-transition:All 0.3s ease-out;
-o-transition:All 0.3s ease-out;
}
.social-wrap li a.google-p:hover {
background: #191919 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0BIPde2ThUW5clqWLjz9LkLb7nf_9UpsEZ8SzBLdtc-m93gROnIy280n5SykBpjh5Iebdj1clwxKNeuPA96kTmKvL5dp3temUxqGoujXjYKaOLWuFscezBeXXqW5i5tcMtKjk0a4WRA/s1600/google.png) no-repeat -0px -0px;
}
.social-wrap li a.rss {
background:#191919 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiN7ocf5tdcl5EwZOMmvooa2ZmozoWOKgzU_M98TX7esY03i3hMb4abksx5tzdwSN0mxTRhOJT9RPtQ1L2MeuxsYCFDZ7u5IToRJlZBzl8QXEHu91ar6qSss_YkTTtHfEApTOXaZeV3g/s1600/twitter.png) no-repeat -0px -88px;
-webkit-transition:All 0.3s ease-out;
-moz-transition:All 0.3s ease-out;
-o-transition:All 0.3s ease-out;
}
.social-wrap li a.rss:hover {
background: #191919 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiN7ocf5tdcl5EwZOMmvooa2ZmozoWOKgzU_M98TX7esY03i3hMb4abksx5tzdwSN0mxTRhOJT9RPtQ1L2MeuxsYCFDZ7u5IToRJlZBzl8QXEHu91ar6qSss_YkTTtHfEApTOXaZeV3g/s1600/twitter.png) no-repeat -0px -0px;
}
* selanjutnya tambahkan kode dibawah ke dalam HTML/JAVASCRIPT<div class='social-wrap'> <ul> <li><a class='facebook' href='http://www.facebook.com/ivankvalentine' target='_blaank'>Facebook</a></li> <li><a class='twitter' href='http://twitter.com/ivankgribatako' target='_blaank'>Twitter</a></li> <li><a class='google-p' href='https://plus.google.com/110561987544809067837' target='_blaank'>Google Plus</a></li> <li><a class='rss' href='#' target='_blaank'>Rss</a></li> </ul> </div>>>> CATATAN <<<
( Ganti warna biru dengan sosmed anda )
### SELAMAT BERJUANG SOBAT ###
Baca Juga Artikel Terkait Lainnya