一、效果展示
二、代码实现:
1.微博分享
<a title="分享到新浪微博" id="wb" class="bshare-sinaminiblog"></a>
<script>
//分享到微博
var currUrl = window.location.href // 实际的分享链接
$('#wb').click(function(){
window.open('http://service.weibo.com/share/share.php?url=' + currUrl + '&title=' + '{$data['title']}' + '&pics=' + '{$data['image']}');
})
</script>
2.QQ好友分享
<a title="分享到QQ好友" id="hy" class="bshare-qqim" onclick="qq();"></a>
<script>
//qq好友
function qq(title,url,pic)
{
var p = {
url: window.location.href,/*获取URL,可加上来自分享到QQ标识,方便统计*/
desc: '', /*分享理由(风格应模拟用户对话),支持多分享语随机展现(使用|分隔)*/
title : '{$data['title']}',/*分享标题(可选)*/
summary : '',/*分享描述(可选)*/
pics : '{$data['image']}',/*分享图片(可选)*/
flash : '', /*视频地址(可选)*/
//commonClient : true, /*客户端嵌入标志*/
site: 'QQ分享'/*分享来源 (可选) ,如:QQ分享*/
};
var s = [];
for (var i in p) {
s.push(i + '=' + encodeURIComponent(p[i] || ''));
}
var target_url = "http://connect.qq.com/widget/shareqq/iframe_index.html?" + s.join('&') ;
window.open(target_url, 'qq','height=520, width=720');
}
</script>
3.QQ空间分享
<!DOCTYPE HTML>
<html>
<head>
<title>QQ空间分享</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<input type="button" onclick="shareQQzone();" value="分享"></input>
</body>
<script src="http://qzonestyle.gtimg.cn/qzone/app/qzlike/qzopensl.js#jsdate=20111201" charset="utf-8"></script>
<script>
//QQ空间分享方法:这样写可以对分享事件进行绑定
function shareQQzone(){
var _url = 'www.wodexiangce.cn';
var _showcount = '0'
var _desc = '我正在我的相册网冲洗照片';
var _summary = '大家都来看看吧';
var _title = '真不错';
var _site = '我的相册网';
var _pic = '';
var _width= '800px';
var _height= '500px';
var _shareUrl = 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?';
_shareUrl += 'url=' + encodeURIComponent(_url||document.location); //参数url设置分享的内容链接|默认当前页location
_shareUrl += '&showcount=' + _showcount||0; //参数showcount是否显示分享总数,显示:'1',不显示:'0',默认不显示
_shareUrl += '&desc=' + encodeURIComponent(_desc||'分享的描述'); //参数desc设置分享的描述,可选参数
_shareUrl += '&summary=' + encodeURIComponent(_summary||'分享摘要'); //参数summary设置分享摘要,可选参数
_shareUrl += '&title=' + encodeURIComponent(_title||document.title); //参数title设置分享标题,可选参数
_shareUrl += '&site=' + encodeURIComponent(_site||''); //参数site设置分享来源,可选参数
_shareUrl += '&pics=' + encodeURIComponent(_pic||''); //参数pics设置分享图片的路径,多张图片以"|"隔开,可选参数
window.open(_shareUrl,'_blank','width='+_width+',height='+_height+',top='+(screen.height-_height)/2+',left='+(screen.width-_width)/2+',toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0');
}
</script>
</html>
全部代码:
<div class="focus_details_title">{$data['title']}</div>
<div class="bshare-custom">
<span>分享:</span>
<!-- <a title="分享到微信" id="wx" class="bshare-weixin" οnclick="weixin();"></a> -->
<a title="分享到新浪微博" id="wb" class="bshare-sinaminiblog"></a>
<a title="分享到QQ空间" id="kj" class="bshare-qzone" onclick="shareQQzone();"></a>
<a title="分享到QQ好友" id="hy" class="bshare-qqim" onclick="qq();"></a>
</div>
<script src="http://qzonestyle.gtimg.cn/qzone/app/qzlike/qzopensl.js#jsdate=20111201" charset="utf-8"></script>
<script>
//QQ空间分享方法:这样写可以对分享事件进行绑定
function shareQQzone(){
var _url = window.location.href;
var _showcount = '0'
var _desc = '';
var _summary = '';
var _title = '{$data['title']}';
var _site = '';
var _pic ='{$data['image']}';
var _width= '800px';
var _height= '500px';
var _shareUrl = 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?';
_shareUrl += 'url=' + encodeURIComponent(_url||document.location); //参数url设置分享的内容链接|默认当前页location
_shareUrl += '&showcount=' + _showcount||0; //参数showcount是否显示分享总数,显示:'1',不显示:'0',默认不显示
_shareUrl += '&desc=' + encodeURIComponent(_desc||'分享的描述'); //参数desc设置分享的描述,可选参数
_shareUrl += '&summary=' + encodeURIComponent(_summary||'分享摘要'); //参数summary设置分享摘要,可选参数
_shareUrl += '&title=' + encodeURIComponent(_title||document.title); //参数title设置分享标题,可选参数
_shareUrl += '&site=' + encodeURIComponent(_site||''); //参数site设置分享来源,可选参数
_shareUrl += '&pics=' + encodeURIComponent(_pic||''); //参数pics设置分享图片的路径,多张图片以"|"隔开,可选参数
window.open(_shareUrl,'_blank','width='+_width+',height='+_height+',top='+(screen.height-_height)/2+',left='+(screen.width-_width)/2+',toolbar=no,menubar=no,scrollbars=no,resizable=1,location=no,status=0');
}
//qq好友
function qq(title,url,pic)
{
var p = {
url: window.location.href,/*获取URL,可加上来自分享到QQ标识,方便统计*/
desc: '', /*分享理由(风格应模拟用户对话),支持多分享语随机展现(使用|分隔)*/
title : '{$data['title']}',/*分享标题(可选)*/
summary : '',/*分享描述(可选)*/
pics : '{$data['image']}',/*分享图片(可选)*/
flash : '', /*视频地址(可选)*/
//commonClient : true, /*客户端嵌入标志*/
site: 'QQ分享'/*分享来源 (可选) ,如:QQ分享*/
};
var s = [];
for (var i in p) {
s.push(i + '=' + encodeURIComponent(p[i] || ''));
}
var target_url = "http://connect.qq.com/widget/shareqq/iframe_index.html?" + s.join('&') ;
window.open(target_url, 'qq',
'height=520, width=720');
}
//分享到微博
var currUrl = window.location.href // 实际的分享链接
$('#wb').click(function(){
window.open('http://service.weibo.com/share/share.php?url=' + currUrl + '&title=' + '{$data['title']}' + '&pics=' + '{$data['image']}');
})
</script>
完成~
本文含有隐藏内容,请 开通VIP 后查看