博客新加入“扫码阅读”功能

今天看到一个用户发了个话题,“PC端的URL在移动端上打开要一个个敲好麻烦,有什么好的办法?”。

确实现在已经是移动时代了,在移动设备上阅读慢慢会成为主流,网站如果没有便捷的方式让用户在移动设备阅读的话还真有点落伍,于是想想就做个“扫码阅读”的功能吧。其实很简单,就是将网址生成二维码就行了。

赌王娱乐城

无论用PHP生成,还是用JavaScript生成都是可以的,从代码改动来说,用JavaScript会更省事些。所以这里就用jQuery吧。正好网上有个 jquery.qrcode.js 的扩展,可以拿来用。

生成QR码的代码如下:

<div id="qrcode"></div>
<script src="http://www.nowamagic.net/librarys/application/views/veda/js/jquery-1.6.1.min.js" type="text/javascript">
<script src="http://www.nowamagic.net/librarys/application/views/veda/js/jquery.qrcode.min.js" type="text/javascript">
<script type="text/javascript">
jQuery.noConflict();
jQuery("#qrcode").qrcode({
    render: "canvas", //table方式
    width: 150, //宽度
    height:150, //高度
    text: ‘http://www.nowamagic.net/‘ //任意内容
});
</script>

jquery.qrcode.js 其实是通过使用jQuery实现图形渲染,画图,支持canvas(HTML5)和table两种方式,默认使用canvas方式,效率最高,当然要浏览器支持html5。直接调用如下:

jQuery(‘#code‘).qrcode("http://www.nowamagic.net/");

如果浏览器不支持 HTML5,或者你要配置图片的尺寸,则可以采用这种方式:

jQuery("#code").qrcode({
    render: "canvas", //canvas or table方式
    width: 150, //宽度
    height:150, //高度
    text: ‘http://www.nowamagic.net/‘ //内容
});

现在博客每篇文章右侧都有生成QR码,可以扫一扫,在手机上阅读了。

时间: 2024-11-07 19:48:22

博客新加入“扫码阅读”功能的相关文章

微信扫码支付功能(2)---用户扫码支付成功,微信异步回调商户接口

用户扫码支付成功,微信异步回调商户 上一篇博客完成用户扫码支付功能: https://www.cnblogs.com/qdhxhz/p/9708534.html 当用户扫码支付成功之后,微信会异步回调商户接口,告知用户支付成功.好让商户进行下一步操作. 一.接口说明 1.流程图 这里要做的就是用户支付成功后,微信异步通知商户支付结果,商户收到通知后告知支付通知接收情况. 2.接口说明 有关商户接口应注意以下几点: (1)该链接是通过[统一下单API]中提交的参数notify_url设置,如果链接

微信扫码支付功能(1)---通过谷歌二维码工具生成付款码

生成付款二维码 一.微信网站扫码支付介绍 1.扫码支付文档 微信开发官方文档:https://pay.weixin.qq.com/wiki/doc/api/native.php?chapter=6_5 有关微信支付的流程图微信官方已经说的很清楚了,这里也无需其它解释.这边采用微信支付扫码模式二(不依赖商户平台设置回调url),所以在生成二维码之前 要先调用微信统一下单支付接口,获得code_url,再通过谷歌二维码工具将code_url生成二维码图片. 2.名称理解 在微信扫码支付功能开发之前,

【练手】博客园 Android 客户端 (码厩 - Cotable)

最近一段时间正好有点空,就利用这点闲余时间学习一下 Android的开发(包括Material Design),因为平时也会经常浏览博客园里大家写得技术交流分享文章,所以干脆称练手的几乎,做一个博客园的手机客户端,之前也稍微收集了一下博客园的api, 由于好像博客园没有官方api来着,所以参考使用了一些其他大牛的api, 如果有时间的话,打算后期自己利用python + django包装一下博客园的web api吧,可能把博客园抓取的内容重构一下,适应移动端的阅读,尤其是移动端阅读含有源代码的博

如何收藏互联网上的任意网页到系统某个分类下,之后进行批量导出发布等---博客备份专家的博文收藏功能您不可不知

我们常用的有道云笔记,印象笔记等软件都有一个实用的功能,复制任何你看到的喜欢的网页到笔记. 新版的博客备份专家也支持了这个功能.比有道云笔记更为强大的地方在于,等收藏的文章多了的时候,您可以通过博客备份专家最常用的导出PDF,CHM功能将这些您逐渐收藏的博文导出成一个专集,之后是离线浏览还是放到手机阅读随你便.接下来,我们就看看这个功能如何使用. 首先,假设您已经会新建收藏分类,如果还不会请先移步阅读一下之前我们写过的 [很喜欢看某方面的文章,如何将不同站点,不同博主同一类别的文章归类整合到一起

JavaWeb个人博客支持插入源码和在线聊天(含源码)

原文地址:http://www.cnblogs.com/liaoyu/p/uudisk.html 源码地址:https://github.com/liaoyu/uublogs 用JavaWeb写了一个简单的博客系统,支持在线插入源码和图片,编辑器为KindEditor,为了练习JQuery,加入在线聊天功能.用得还是很古老的JSP+Servlet,由于做到后来,兴趣减少及时间的原因,还有很多功能没有完成.. 开发环境:myeclipse mysql5 jdk6 主页: 留言: 在线聊天: 搭配项

51CTO博客2.0——移动版关注功能正式上线

喜大普奔,2018年3月5日下午8点30分移动版关注功能正式上线了>>> 不知道关注功能是干嘛的?(敲黑板,敲黑板,看这里) 对于作者>>> 1.拥有属于自己的粉丝2.增加自身品牌影响力3.将文章以最快的速度推送给自己粉丝(有了这关注功能,朕今后也是坐拥百万粉丝的公众人物了,吼~吼~吼~) 对于读者>>> 1.不再错过大牛们的每一篇文章2.学习系列文章,更加系统.追文更便利3.第一时间收到作者回复,解决疑问不再等待.(又关注了个大牛来充实自己,这感觉不

博客新家来了!!!

本人个人独立博客已经开通,网址为: http://www.zhouzhaoxiong.com/ 本博客上的文章是作者工作经验及学习心得的总结,希望本博客可以成为广大IT从业者及爱好者的学习和交流的平台. 眼下,本博客包含下面八部分的内容:         1) C语言:http://www.zhouzhaoxiong.com/category/c-language         2) 数据库技术:http://www.zhouzhaoxiong.com/category/sql        

Node.js 博客实例(七)分页功能

原教程 https://github.com/nswbmw/N-blog/wiki/_pages的第七章,由于版本等的原因,在原教程基础上稍加改动即可实现. 给博客的主页和用户页面增加分页功能.设定:主页和用户页面每页最多显示十篇文章. 这里要用到 mongodb 的 skip 和 limit 操作. 打开 post.js ,把 Post.getAll 函数修改如下: //读取文章及其相关信息 Post.getTen = function(name,page,callback) { //打开数据

Node.js 博客实例(六)留言功能

原教程https://github.com/nswbmw/N-blog/wiki/_pages的第五章,由于版本等的原因,在原教程基础上稍加改动即可实现. 实现用户给文章留言的功能,留言保存在数据库中. post.js ,修改 Post.prototype.save 中要存入的文档为: //要存入数据库的文档 var post = { name: this.name, time: time, title: this.title, post: this.post, comments:[] }; 我