缺陷
目前在从主页点击进入文章页面时，二维码按钮点击后无法正常弹出二维码，出现js报错，刷新页面后问题消失，尚未找到解决方案，期待高手指教。
问题已修复，查看文章
以下正文
这几天写作情绪低落，索性又对博客进行了一些调整，其实我一直喜欢博客这种形式，甚至还创建了同样主题的博客，但对于我这种不太擅长写作的人来说，使用现有主题更合适。
早就想在我的文章底部添加二维码分享和微博分享的功能，但由于技术限制一直没有成功。经过这几天的反复尝试，终于在多次失败后实现了这些功能。也许是因为，我现在可以通过二维码直接分享文章链接到微信或QQ，而微博分享按钮则可以直接将链接分享到微博。
所以我将这些经验分享出来，有需要的朋友可以借鉴。
php
`
`
CSS
`.share a {display: inline-block;color: #666;margin-right: 15px}
.share a:hover {color: #f55}
.share {position: relative;text-align: right;font-size: 25px;}
.icon-wechat:before {content: “\e607”;}
.icon-weibo:before {content: “\e608”;}
#qr {z-index: 10;display: none;position: absolute;background: #fff;right: 10%;top: -290%;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px}
@font-face {
font-weight:400;font-style:normal;font-family:icomoon;src:url(data:application/x-font-ttf;charset=utf-8;base64,…);
}[class*=” icon-“],[class^=icon-] {
text-transform: none;
font-weight: 400;
font-style: normal;
font-variant: normal;
font-family: icomoon;
line-height: 1;
speak: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}`
CSS自适应
`@media(max-width:880px){
#qr {z-index: 10;display: none;position: absolute;background: #fff;right: 22%;top: -290%;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px}
}`
JS
`$(function(a) {
a(“body”).on(“click”,
function(b) {
var c = a(b.target).attr(“class”) || “”,
d = a(b.target).attr(“rel”) || “”;
if (c || d) switch (!0) {
case - 1 != c.indexOf(“icon-wechat”) : a(“.icon-wechat”).hasClass(“tg”) ? a(“#qr”).toggle() : (a(“.icon-wechat”).addClass(“tg”), a(“#qr”).qrcode({
width: 128,
height: 128,
text: location.href
}).toggle());
}
});
});`
JS补充
通过邮件评论链接直接访问过来的网址会带评论后缀，如果此时扫描二维码会直接链接到评论位置，因此需要提取文章网址而不是地址栏网址，所以对部分代码进行了修改。
`text: location.href //这里需修改
text: $(“link[rel=canonical]”).attr(“href”)`
JS调用
``