|
|
<!-- 二维码弹出层 -->
|
|
|
<div class="wx-qrcode-wrapper">
|
|
|
<!-- 遮罩层 -->
|
|
|
<div class="mask"></div>
|
|
|
<div class="wx-qrcode" style="width:230px;">
|
|
|
<div class="share">
|
|
|
<span style="font-size: 14px;text-align: center;">分享到微信朋友圈</span>
|
|
|
<!-- 关闭图标 -->
|
|
|
<a href="javascript:;" class="icon-close2" onclick="wxHide()">×</a>
|
|
|
</div>
|
|
|
|
|
|
<!-- 生成的二维码容器 -->
|
|
|
<div id="qrcode"></div>
|
|
|
<div class="bd_weixin_popup_foot">
|
|
|
打开微信,点击底部的“发现”,<br>
|
|
|
使用“扫一扫”即可将网页分享至朋友圈。
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
|
|
|
<script src="https://cdn.bootcss.com/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
|
|
|
<script>
|
|
|
var url = window.location.href;
|
|
|
/* 生成二维码 */
|
|
|
$("#qrcode").qrcode({
|
|
|
text: url, //设置二维码内容
|
|
|
render: "canvas", //设置渲染方式
|
|
|
width: 220, //设置宽度,默认生成的二维码大小是 256×256
|
|
|
height: 220, //设置高度
|
|
|
typeNumber: -1, //计算模式
|
|
|
background: "#ffffff", //背景颜色
|
|
|
foreground: "#000000" //前景颜色
|
|
|
});
|
|
|
|
|
|
/* 点微信图标,触发二维码弹出层显示 */
|
|
|
function wxShow() {
|
|
|
$('.wx-qrcode-wrapper').show()
|
|
|
}
|
|
|
|
|
|
/* 关闭二维码弹出层 */
|
|
|
function wxHide() {
|
|
|
$('.wx-qrcode-wrapper').hide()
|
|
|
}
|
|
|
|
|
|
</script> |
|
|
\ No newline at end of file |
...
|
...
|
|