基于HTML5的移动阅读器

基于HTML5的移动阅读器(也是跟着慕课网视频来学习的,不过收获很多)
开发环境:Windows7 + sublime
框架:zepto.js + jquery.jsonp.js + jquery.base64.js
zepto.js:体积小,适用于手机浏览器,语法和jquery类似;
Jquery.jsonp.js:一个支持JSONP调用的jquery插件,支持出错时的Ajax回调;
jquery.base64.js:实现前台的加密解密(图片利用base64代码比较繁琐但可以减少http请求);
项目成果:
这里写图片描述
源码:https://github.com/Tzrong/webapp
项目描述:利用HTML5、Ajax、js相关框架等技术开发的一款移动端阅读器;并且会通过HTML5的Localstorage把设置的背景颜色、字体大小等信息储存在本地;阅读器的内容是模拟后台数据,通过ajax本地跨域获取数据并通过jsonp对数据进行相关处理将其展现出来;使用base64制作背景图片,减少http请求,加快首屏显示速度;
重要源码:将入口函数、数据交互、Dom事件等分离开来,使代码更加易读、维护;并且使用闭包来避免全局变量污染,将复用的Dom利用变量存储起来;在使用HTML5存储时,为了避免同于情况下相同,增加前缀来区分;
遇到的问题:
1.谷歌浏览器不支持本地跨域:给浏览器传入启动参数(allow-file-access-from-files),允许跨域访问。 直接在快捷键图标右键,点击属性,修改目标(在后面加上“”–allow-file-access-from-files”,注意–前面有一个空格),这样就可以正确访问了。
2.设置背景颜色时,通过localStorage查询已经保存,但是刷新后还是会返回至初始颜色,经查询是因为初始化背景background的问题;
3.回调函数要注意其参数的正确性;
4.each函数遍历的用法,注意参数。
5.往git上传代码时:
git add xxx
有个警告:warning: LF will be replaced by CRLF in XXXXXXXXXXXXXX.
解决:
git config core.autocrlf false
…其他好像没什么大问题,跟着老师的教程走..
(注意代码风格及规范,学习老师的逻辑思路。)

评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值