最近公司项目准备更换图片上传的插件，原来的是一个Flash控件，其实用起来还是不错的，还有进度条，浏览器支持情况也不错。不过因为某些页面的图片上传涉及到了跨域的问题，Flash似乎解决不了了，所以准备索性换成HTML5的，高端大气上档赤。然后这个HTML5上传图片功能自然落到了我的手上了。
一般来说图片上传无非就是文件操作的问题，本来这是服务器对文件流的一个操作问题，前端应该是管不上的，不过HTML5再次赋予了我们前端神圣而伟大的权利，有了HTML5部分后端失业了lol。
其实以前写过一个上传图片的插件，不过那时还活在IE6年代，只能用iframe搞定，虽然还挺好使的，不过在HTML5面前就是一个战斗力负5的渣渣，不仅需要后端返
继续阅读 »
Sangmin is a Senior JavaScript developer working at NHN and the creator of the JavaScript animation library Collie.
I use collie framework to developed some HTML5 game.
继续阅读 »
HTML5中的canvas可以实现很多图像、多媒体方面的功能，比如把视频的内容二次处理后在canvas上显示。
强大的drawImage
var video = document.querySelector('video');
var canvas1 = document.querySelector('#canvas1');
var ctx1 = canvas1.getContext('2d');
ctx1.drawImage(video, 0,0, 320, 180, 0,0, 320, 180);
继续阅读 »
概述
定义:以微信传播为主要渠道的 HTML5 应用
技术:HTML5、JS、CSS、Jquery、Zepto、collie
资源:PSD、JPG、PNG、MP4、MP3、OGG
设备:Google Nexus 5以上,三星Galaxy Notes以上,iPhone4以上
继续阅读 »
所谓的mouselook其实就是第一人称视角，而pointerlock技术（其实和第一人称没什么关系,只是说这个技术可以用来实现第一人称）其核心就是让鼠标隐藏并且无论怎么拖动鼠标，鼠标指针都不会跑出目标区域。
继续阅读 »
随着手机性能的提高，以及iOS和Android两个平台的普及，更多的App都会选择两个平台的App都进行开发，在有些时候，为了更加快速的开发，我们会采用hybird方式开发，这个时候我们需要使用webview并且自己进行一些配置。Android的webview在低版本和高版本采用了不同的webkit版本内核，4.4后直接使用了chrome，因此问题很多，这里分享一些我使用过程的一些技巧和遇到的坑。
more
webview配置
java
mWebview.getSettings().setJavaScriptEnabled(true); //设置允许运行javascript
// HTML5 API flags
mWebview
继续阅读 »
html5引入的message的API可以更方便、有效、安全的解决这些难题。postMessage()方法允许来自不同源的脚本采用异步方式进行有限的通信，可以实现跨文本档、多窗口、跨域消息传递。
继续阅读 »
啥都不说， 直接先来一张效果图......
小伙伴们，别急，咱们先来分析一下主要功能点：
图片预览
图片拖拽
图片缩放
图片裁剪
图片预览
图片预览的功能技术方案是将用户的图片文件转成Base64编码并设置到标签的src属性，获取图片文件的Base64编码需要通过HTML5的新特性FileReader，具体代码如下：
js
getImgBase64: function(imgFile, cb){
if(!window.FileReader){
alert('系统暂不支持针对你的浏览器的文件上传功能，建议使用最新版的Chrome！');
return false;
}
var reader =
继续阅读 »
什么是Websocket
Websocket 是HTML5开始推出的一种新的协议，实现了浏览器与服务端的全双工通信，在使用WebSocket时，，只要和服务端做一个握手(handshaking)动作，浏览器首先要向服务端发起一个特殊的HTTP请求，其头部附加了信息Upgrade: WebSocket，表明这是一个申请协议升级的HTTP请求，服务端解析出来这些信息后，产生一个应答给客户端，这样双方的WebSocket连接就建立起来了，即可形成一条全双工的数据通道，两者之间可以进行互相通信，直到客户端和服务端中的某一方主动关闭连接。
在WebSocket出现之前，为了解决浏览器和服务端之间的实时推送问题，采取了很多解决方案，通常使用
继续阅读 »