[Code] Thanh chia sẻ mạng xã hội

Demo:



CSS:

Code:

ul.socialicons{
list-style: none;
margin:0px;
padding:5px;
position:fixed;
left:0px;
top:250px;
}
ul.socialicons li{
padding-bottom:8px;
padding-left:15px;
}
ul.socialicons li img{
opacity:0.5;
transition-duration:0.5s;
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;
-o-transition-duration:0.5s;
}
ul.socialicons li img:hover{
opacity:1.9;
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
transform: rotate(360deg);
}

Code:

<ul class="socialicons"><li><a id="facebook" href="http://www.facebook.com/" original-title="Facebook"><img src="http://cdn1.iconfinder.com/data/icons/WPZOOM_Social_Networking_Icon_Set/32/facebook.png"></a></li><li><a href="http://www.twitter.com"><img src="http://cdn1.iconfinder.com/data/icons/WPZOOM_Social_Networking_Icon_Set/32/twitter.png"></a></li><li><a href="http://www.youtube.com/"><img src="http://cdn1.iconfinder.com/data/icons/WPZOOM_Social_Networking_Icon_Set/32/youtube.png"></a></li><li><a href="http://www.digg.com/"><img src="http://cdn1.iconfinder.com/data/icons/WPZOOM_Social_Networking_Icon_Set/32/digg.png"></a></li><li><a href="https://google.com/"><img src="http://i41.servimg.com/u/f41/14/41/92/25/google10.png"></a></li></ul>