Wolder King: Cssli Sosyal Ağ Butonları Kodu

<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUbx_rBatTuoHSzWHFC_ItAxMPhZ3YSizGV0eHVutOPsIUJWePW0cpvo_99ijA0nAZZtu_TLuFY_E1vvzrHwOSLwBZXoS9bzeU9ByvaHQ5Gat6N5YwZodRqXyTv1pMTGlDr6DPBJZ3m54D/s1600/social-networks.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="136" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUbx_rBatTuoHSzWHFC_ItAxMPhZ3YSizGV0eHVutOPsIUJWePW0cpvo_99ijA0nAZZtu_TLuFY_E1vvzrHwOSLwBZXoS9bzeU9ByvaHQ5Gat6N5YwZodRqXyTv1pMTGlDr6DPBJZ3m54D/s1600/social-networks.jpg" width="320" /></a></div>
Yeni yaptığım sosyal ağ butonları kodu çok hoşunuza gidicek. Çünkü bu mükemmel kod süper bir efekt ile çalışıyor. Sitenize eklemek ise çok kolay. Bloggerda Gadget Ekleden ve diğer sitelerde kullanmak istediğiniz yere bunu koyun. Çok hoşunuza gidecek. Eminim...<br />
<textarea class="bginput" cols="42" name="wep-kodlari" onclick="this.focus();this.select()" rows="5" style="height: 112px; margin: 0px; width: 673px;">

<wolderking>
<div class="wolderking">
 
<ul>
<li class="rss"><a href="http://feeds.feedburner.com/wolderking" target='_blank'><span></span>RSS</a></li>
<li class="twitter"><a href="https://twitter.com/wolderking" target='_blank'><span></span>Twitter</a></li>
<li class="gplus"><a href="https://plus.google.com/u/0/+WolderKingsten/posts" target='_blank'><span></span>Google Plus</a></li>
<li class="facebook"><a href="https://www.facebook.com/wolderking" target='_blank'><span></span>Facebook</a></li>
</ul>
</div>
<style> 
.wolderking li { 
display: block !important; 
margin-right: 0 !important; 
width: auto !important; 
} 
.wolderking li a span { 
display: block; 
height: 32px; 
left: 0; 
position: absolute; 
top: 2px; 
transform: rotate(-20deg); 
-wolderking-transform: rotate(-20deg); 
transition-duration: 0.8s; 
transition-property: all; 
width: 32px; 
} 
.wolderking .twitter span { 
background-color: transparent; 
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggLl2NmVmAhsgVVKqFeBNW1r9K3WEMpTQ79HNGeCRajrSlotLdkIjAvQLKF_97X9lIJHFVrPNEZbmKXGvGIDWTrV-aTAcoKjuZJfChUx_Xsqe2qsjlwBu1wHXVbA37fFz-7Y-ZZKWugwE/s1600/twitter_icon.png) no-repeat; 
} 
.wolderking .twitter a { 
background: #91C661; 
} 
.wolderking li a:hover span { 
transform:rotate(340deg); 
-wolderking-transform:rotate(340deg);    
}    
ol, ul { 
list-style: none outside none; 
} 
.wolderking li { 
display: block !important; 
margin-right: 0 !important; 
width: auto !important; 
} 
.wolderking li { 
display: inline-block; 
margin: 0 20px 10px 0; 
position: relative; 
width: 200px; 
} 
.wolderking .rss span { 
background-color: transparent; 
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhH-dCuLjgnWoYX73cNWpw62kdneJK9llXyeCIZTCgBin9dBsjPxWkXy4z6dc6grBTHXgfZc1-Or5jy_CthbApzgfSiezjXIcPJlmEXso4NavLZapQm11ZSYi3dX6Vpa4TEiofsGxVqCQM/s1600/rss-icon.png) no-repeat; 
} 
.wolderking .rss a { 
background: #F67F00; 
} 
.wolderking li a { 
color: #FFFFFF; 
display: block; 
font-family: verdana; 
font-size: 12px; 
padding: 10px 10px 10px 40px; 
text-decoration: none; 
font-weight: bold; 
} 
.wolderking li a span { 
display: block; 
height: 32px; 
left: 0; 
position: absolute; 
top: 2px; 
transform: rotate(-20deg); 
-wolderking-transform: rotate(-20deg); 
transition-duration: 0.8s; 
-wolderking-transition-duration: 0.8s; 
transition-property: all; 
width: 32px; 
} 
.wolderking li a:hover span { 
transform:rotate(340deg); 
-wolderking-transform:rotate(340deg); 
}  
.wolderking .twitter span { 
background-color: transparent; 
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggLl2NmVmAhsgVVKqFeBNW1r9K3WEMpTQ79HNGeCRajrSlotLdkIjAvQLKF_97X9lIJHFVrPNEZbmKXGvGIDWTrV-aTAcoKjuZJfChUx_Xsqe2qsjlwBu1wHXVbA37fFz-7Y-ZZKWugwE/s1600/twitter_icon.png) no-repeat; 
} 
.wolderking .twitter a { 
background: #91C661; 
} 
.wolderking .gplus span { 
background-color: transparent; 
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhc0-NC7KqnAVUPzMGEji2aZBGn25xB_JWtvb6gldUkkUHXu1d8cW3B5lLXNMwrhW4R7cyRA7ZHDP8j1Cer3onRsJXCHKkLN1Ntbr1nRmQEqKh1KGnlrc0CoGTjuOqJ9jnC1-BmrAqwJe4/s1600/googleplus.png) no-repeat; 
} 
.wolderking .gplus a { 
background: #D74D2F; 
} 
.wolderking .facebook span { 
background-color: transparent; 
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT-KqLhzOfNTGrmA_eMB-zydIYLiZF_fpvJlGB7gDj-0tjHE2u97Ykt8EScZg5VOuxy0lp-jaRFU4wSX9wlf7xUGyXXrpVQK_mvFB7IwSjSQjJJVd2m67FbUDqrnKIDxu7iNtiWblZmEo/s1600/facebook-icon.png) no-repeat; 
} 
.wolderking .facebook a { 
background: #3B5998; 
} 
</style>
</wolderking>

Efektli Sosyal Ağ Butonları Kodu

Yeni yaptığım sosyal ağ butonları kodu çok hoşunuza gidicek. Çünkü bu mükemmel kod süper bir efekt ile çalışıyor. Sitenize eklemek ise ç...

Devamı »

Efektli Sosyal Ağ Butonları Kodu

Popüler

Arşiv