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