Do you want to use the share bar that Mashable is using? If so download this script.
http://skin.zoosper.com/skin/global/js/share.mini.js
How to use this?
I am using addthis for share tracking, so you need to register at addthis.com. then use the following code.
<div id="sharebox" class="">
<div class="cfshare">
<script type="text/javascript">
jQuery(document).ready(function(){
if(jQuery('div#sharebox').length > 0)
{
jQuery('#sharebox').cfShare({
addthisId : 'codefight',
animate : false //or true,
bgColor : '#fff',
fromPosition : 'original', //or 'top'
marginFixed : '0 7px 4px -572px',
pageWidth : 980,
shareClients : ['facebook','facebooksend','twitter', 'googleplusone', 'linkedin', 'addthis'],
shareLeft : -84,
sharePadding : 5,
shareWidth : 70,
startTop : 70,
topPadding : 0
});
}
})
</script>
</div>
</div>
NOTES:
- addthisId: Addthis.com ID Goes Here If You Want To Track Page Shares.
- animate : Do you want to animate your share bar? Default is true.
- bgColor : Set your color for share background. default is '#fff'
- fromPosition: 'original', or 'top'. Do you want to float to left from top or from the original place you inserted code.
- marginFixed : Margin for floating sharebar when animation is set to false. You may need to adjust value of left margin.
- pageWidth : Website page wrapper width.
- shareClients: 'facebook', 'facebooksend', 'twitter', 'googleplusone', 'linkedin', 'addthis'. You can select your choice and change the position as you like.
- shareLeft : Left position from the place you inserted this code.
- sharePadding : Padding for sharebar. Default is 5px.
- shareWidth : Width of the sharebar for floating menu.
- startTop : Top-margin when page load [normally height of header]
- topPadding : Top padding for the sharebox.