Products
GG网络技术分享 2025-03-18 16:17 0
需要引入js:
document.write(\"<script language=javascript src=\'https://cdn.bootcdn.net/ajax/libs/jquery.qrcode/1.0/jquery.qrcode.min.js\'></script>\");
html代码
<a href=\"javascript:;\" class=\"share wx js-share icon-share-weichat\" data-cmd=\"weixin\" title=\"分享到微信\"></a>
<a href=\"javascript:;\" class=\"share qq js-share icon-share-qq\" data-cmd=\"qzone\" title=\"分享到QQ空间\"></a>
<div id=\"bdshare_weixin_qrcode_dialog\" class=\"bd_weixin_popup\">
<div class=\"bd_weixin_popup_head\">
<span>
分享到微信朋友圈
</span>
<a href=\"#\" onclick=\"return false;\" class=\"bd_weixin_popup_close\">
×
</a>
</div>
<div id=\"bdshare_weixin_qrcode_dialog_qr\" class=\"bd_weixin_popup_main\">
</div>
<div class=\"bd_weixin_popup_foot\">
打开微信,点击底部的“发现”,
<br>
使用“扫一扫”即可将网页分享至朋友圈。
</div>
</div>js绑定
<script>
var ShareTip = {
shareToWx: function () { // 分享到微信的二维码
$(\"#bdshare_weixin_qrcode_dialog_qr\").qrcode({
text: path, // 设置二维码内容
render: \"table\", // 设置渲染方式
width: 256, // 设置宽度,默认生成的二维码大小是 256×256
height: 256, // 设置高度
typeNumber: -1, // 计算模式
background: \"#ffffff\", // 背景颜色
foreground: \"#000000\" // 前景颜色
});
},
shareToQq: function (content, url) { // 分享到腾讯QQ
var shareqqstring = \'https://connect.qq.com/widget/shareqq/index.html?url=\' + encodeURIComponent(url) + \'&title=\' + content + \'&desc=\'+content+\'&pics=\';
window.open(shareqqstring);
},
}
var path = window.location.href
var title = \'{$info.title}\';
ShareTip.shareToWx()
$(\".icon-share-weichat\").click(function() {
$(\'#bdshare_weixin_qrcode_dialog\').show();
})
$(\'.bd_weixin_popup_close\').click(function() {
$(\'#bdshare_weixin_qrcode_dialog\').hide();
})
$(\".icon-share-qq\").click(function(params) {
ShareTip.shareToQq(title, path)
})
</script>
css代码
.bd_weixin_popup{position:fixed;left:50%;top:50%;padding:10px;width:280px !important;height:340px !important;background:#fff;border:solid 1px #d8d8d8;z-index:11001;font-size:12px;margin-top:-170px;margin-left:-140px;display:none}
.bd_weixin_popup .bd_weixin_popup_head{font-size:12px;font-weight:bold;text-align:left;line-height:16px;height:16px;position:relative;color:#000}
.bd_weixin_popup .bd_weixin_popup_head .bd_weixin_popup_close{width:16px;height:16px;position:absolute;right:0;top:0;color:#999;text-decoration:none;font-size:16px}
.bd_weixin_popup .bd_weixin_popup_main{padding:15px 10px;min-height:150px;_height:150px}
.bd_weixin_popup .bd_weixin_popup_foot{font-size:12px;text-align:left;line-height:22px;color:#666}Demand feedback