文章列表
刘恒兵 ,永远不要怀疑一个人的潜力! 于 1年前发表 3196 6 1
感言 终于有时间停下来来回顾一下 2015上海Qcon [http://2015.qconshanghai.com/] 分享 《Hybrid App极限优化解决方案》 [http://2015.qconshanghai.com/speakers/201931] 旅途。不喜欢总结,往往是比较痛苦的,些许时间之后回过头来,发现部分细节已然模糊。不得已要求自己写点什么,哪怕随便写写,给自己看也好,给其他人参考也好。总归于相忘于历史较好。 首先很感谢 Qcon [http://www.infoq.com/cn/qcon/] 这个大平台,也感谢组织者 @臧秀涛 [http://weibo.com/zangxiutao] 全程的鼎力帮助。特别感谢 @郝培强 [http://tinyfool.org] 老师的支持,有幸能和@罗升阳、@ 赵世婚、@李跃辉、@胡文江(白衣)、@董一凡 几位大牛一起分享《移动开发新趋势》这个专题。 心路历程 “一次收获颇多的成长历程”,用这句话概括,最适合不过了。至于聊到收获,大致概括为:
1年前
HTML&HTML5
袁飞翔 于 1年前发表 2218 1 0
序言 不同项目下lib里的promise/deferred往往是差异化最多的,用起来和自己的习惯相比经常是缺胳膊少腿多屁眼有卵用,因此聊聊标准的Promise的啥样的 不同的PROMISE差异基本表现如下: * 构造Promise对象 new Promise().resolve() or new Pomise(function(resolve, reject) {}) * 是否有 .done() .fail() .always() 等方法 * 是否有 Promise.all() 方法 * 是否有 isRejected() isResolved() * .then() return 结果链式的处理 有哪些标准 * Promises/A [http://wiki.commonjs.org/wiki/Promises/A] * Promises/A+ [https://promisesaplus.com/] Promises/A+兼容扩展Promises/A而来,es6里的Promise准守Promises/A+规范,也是当今的标准规范。 标准的PROMISE 构造 :
1年前
HTML&HTML5
moonye 于 1年前发表 2137 5 0
咳咳,如果你是被标题吸引过来的,只能说明你思想不太纯洁。 其实,这里要讲的,是关于一个游戏的故事,这个游戏的名字叫做小三传奇,曾经在ios平台上面很火的一款游戏。网上2048方面的教程很多,于是动了自己弄一个小三传奇的教程,附上源码,这样大家就可以一起high了。其实写之前会觉得还挺复杂的,但是基本的逻辑想通之后,会发现思路还是比较清晰简单的。 演示地址看 这里 [http://jsfiddle.net/ABxx3/201/] 完整代码可以看 这里 [https://github.com/moonye6/smallthree] 介绍 这是一款益智类的小游戏,最开始出现在ios平台上,还是收费的(6元),操作简单,需要动脑经才能得高分。一局快则几分钟,慢则二十分钟甚至更久。在它出来之后的几个月后,android平台上才出了一款类似的益智游戏,2048.虽然类似,但习惯了原来游戏的风格和规则之后,对2048的兴趣不大。 以下介绍一些基本的规则: 1. 游戏初始界面是一个4*4的表格,游戏开始时,在最外层(0行,3行,0列,3列)随机位置生成两个数字,分别是1和2。 2.
1年前
HTML&HTML5
coverguo 于 2年前发表 5874 4 1
以下是之前学习的一些HTML5 API的总结,在HTML5中有许多功能和接口很值得我们去了解和学习。 * 页面可见性API--page Visbility * 全屏API --full Screen * 获取MediaAPI--getUserMedia * 电池API --battery * 资源预加载API--link Prefetching PAGE VISIBILITY 页面可见性API 该API可以用来检测页面对于用户的 可见性 ,即返回用户当前浏览的页面或标签tap的状态变化。 在最小化浏览器、切换tap页面时生效.(如需对app中几个webview进行切换操作时,可使用pageVisibility接口进行相应的事件监听和处理。) PAGE VISIBILITY的介绍 【document.hidden】 该值表示page是否是可见的,值为boolean值 【document.visibilityState】 这个visibilitystate 可有三个值得可能: 【visible】 表示该page是处于最前面的页面并且不是处于一个最小化的窗口
2年前
HTML&HTML5
张颖 ,认真认真 于 2年前发表 6835 5 1
VIDEO标签属性和事件介绍 为了文章的完整性,首先还是列举一下video标签的属性: * src :视频的属性 * poster:视频封面,没有播放时显示的图片 * preload:预加载 * autoplay:自动播放 * loop:循环播放 * controls:浏览器自带的控制条 * width:视频宽度 * height:视频高度 Video 对象属性: * audioTracks: 返回表示可用音频轨道的 AudioTrackList 对象。 * autoplay: 设置或返回是否在就绪(加载完成)后随即播放视频。 * buffered: 返回表示视频已缓冲部分的 TimeRanges 对象。 * controller: 返回表示视频当前媒体控制器的 MediaController 对象。 * controls: 设置或返回视频是否应该显示控件(比如播放/暂停等)。 * crossOrigin: 设置或返回视频的 CORS 设置。 * currentSrc: 返回当前视频的 URL。
2年前
HTML&HTML5
coverguo 于 2年前发表 10763 18 6
创世纪第一章 首卷原文 起初我创造了canvas 。 我说,要有雨,就有了雨; 我说,要有雪,就有了雪。 而对于前端来说,canvas即是天地 在canvas这个天地上,前端可以呼风唤雨,无所不能。 ------------------------------------华丽的分割线------------------------------------------------- ##文章起因 其实就是最近在做一个需求,需要有下雨下雪的动画特效, 故在这里做了一个drop的组件,来展现这种canvas常见的下落物体的效果。那么,=。= ,就让我们先看看效果吧。 [github地址] 之后贴出来哈。。。。 ##效果展示 调用代码 <!DOCTYPE html><htmllang="en"><head><metacharset="UTF-8"><title>Document</title><style>#canvas{ width:100%; height:100%;
2年前
HTML&HTML5
rakuluo 于 2年前发表 1730 0 0
Demo http://lumixraku.github.io/demos/Fog/Fog.html [http://lumixraku.github.io/demos/Fog/Fog.html] CANVAS TUTORIAL 给大家安利一个学习Canvas的站点 http://www.html5canvastutorials.com/ [http://www.html5canvastutorials.com/] 用到的方法 在开始之前, 最好了解一下Canvas的最基本的使用 * stroke() * save() clip() restore() http://jo2.org/html5-canvas-clip/ [http://jo2.org/html5-canvas-clip/] http://www.html5canvastutorials.com/advanced/html5-canvas-clipping-region-tutorial/
2年前
HTML&HTML5
梁伟盛 于 2年前发表 2548 3 0
据说本贵族圈每月不分享就邀请雪糕。。。所以分享下一个简单的Canvas插件 Canvas元素是HTML5的一部分,允许脚本语言动态渲染位图像,你可以使用javascript用它来绘制图形、图标、以及其它任何视觉性图像。它也可用于创建图片特效和动画。 (反正就是好东西) 既然是HTML5的特性,那必须是只有支持HTML5的浏览器才能使用,兼容性如下图: [http://7tszky.com1.z0.glb.clouddn.com/Fv-2A9lFuKVQqWrj-HmNoL77JD-2] -------------------------------------------------------------------------------- 使用到的API 参考资料~W3School [http://www.w3school.com.cn/tags/html_ref_canvas.asp] BEGINPATH 定义:开始一条路径,或重置当前的路径。 context.beginPath();
2年前
HTML&HTML5
rakuluo 于 2年前发表 2120 1 1
* 为 JavaScript 引入线程技术 不必再用 setTimeout()、setInterval()、XMLHttpRequest 来模拟并行 * Worker 利用类似线程的消息传递实现并行。这非常适合您确保对 UI 的刷新、性能以及对用户的响应。 * Web Worker 的三大主要特征:能够长时间运行(响应),理想的启动性能以及理想的内存消耗。 它允许在 Web 程序中并发执行多个 JavaScript 脚本,每个脚本执行流都称为一个线程,彼此间互相独立,并且有浏览器中的 JavaScript 引擎负责管理。这将使得线程级别的消息通信成为现实。使得在 Web 页面中进行多线程编程成为可能。 专用 Web Worker (Dedicated Web Worker) 提供了一个简单的方法使得 web 内容能够在后台运行脚本。一旦 worker 创建后,它可以向由它的创建者指定的事件监听函数传递消息,这样该 worker 生成的所有任务就都会接收到这些消息。 WEBWORKER 的类型
2年前
HTML&HTML5