此插件是基于jquery的,因此需要先引入jquery文件,之后在引入样式及js文件:
<link rel="stylesheet" href="css/share.css" type="text/css" /> <script src="js/share.js" type="text/javascript"></script>
组件的方式使用,代码如下:
<div id="socialShare"></div> $(function() { $("#socialShare").socialShare({ content: '自己动手编写jquery插件', url:'http://kiritor.github.io/2015/09/28/shiro-Authentication/', titile:'自己动手编写jquery插件title' }); });
也可以自己定义单个按钮的样式,独立分享,例如:
<a id="shareQQ" class="className">分享到QQ空间</a>$("#shareQQ").on("click",function(){ $(this).socialShare("tQQ"); })
插件提供一些单独的分享方法,当然也可以自己定义参数
$("#shareQQ").on("click",function(){ $(this).socialShare("tQQ",{ url:'', content,'', title:'' }); })
当前支持4个参数:
{ url: '分享的网址', title: '分享的标题', content: '内容', pic: '图片'}
参数为可选,其中url和title的默认值为当前页面的url和title
方法名 | 参数 | 描述 |
init | param:{url,content,title,pic} | 初始化插件 |
tQQ | param:{url,content,title,pic} | 分享到腾讯微博 |
qZone | param:{url,content,title,pic} | 分享到QQ空间 |
sinaWeibo | param:{url,content,title,pic} | 分享到新浪微博 |
doubanShare | param:{url,content,title,pic} | 分享到豆瓣 |
weixinShare | param:{url,content,title,pic} | 分享到微信 |