例如 Opera 是最先做 Web Database 的，那时候别人都做 Storage 。现在很多表单输入类型（如日期）都只有 Opera 做。感觉另外几家浏览器都做主流功能，所以功能覆盖重叠很大。 Opera 则专门做非主流功能。 回复内容：opera擅长引领潮流，创造领先功能。悲催的是，市场推广方面总是差强人意。另外难上手是很郁闷的。用opera上网浏览是很简单的，但是在细致的微调和设定上。小白用户就一头雾水了。谷歌浏览器之所以迅速的占领了可观的...
用的是Mac回复内容： sublime text做一点小补充，Sublime Text是一款轻量级的文本编辑器，算是现在前端工程师用的比较多的一款编辑器，现在的Sublime Text 3集成了Emmet插件，可以快速编写HTML和CSS代码，上手之后构建网页结构和样式非常迅速如果LZ更喜欢用大型IDE的话可以考虑WebStorm，编写Javascript也有代码提示OSX上用Brackets也是不错的选择，同样支持Emmet插件，最大的优点是有实时预览功能，妈妈再也不用担心我的Tab F5键坏...
回复内容： 答案是可以。实现基本步骤：操作摄像头，获取图片。技术要点：MediaStream、GetUserMedia、File api。利用canvas使用相关算法分析图片识别图片得出结果。技术要点：getImageData* 涉及到的技术点浏览器们（包括移动端）支持各异，现阶段要开发并投产还不太现实。比如MediaStream的支持情况：http://caniuse.com/#feat=stream* 识别算法是一个难点，不过谢谢github，谢谢开源社区，@Shou Jiesong 的答案中有phonegap的插...
前段时间，我看了下HTML5的东西，包括客户端存储，地理位置，web workers以及音频，发现在FF和chrome下都没问题，但是到IE就见了鬼，有的最新版的IE11也没用，但是现在还是听说HTML5在大面积普及，我就有点小费解，为什么核心的东西在IE上体现不出来还能大面积普及呢？ 我就想问下，HTML5真正让人喜欢的是那些东西，或者用的最多的是那些东西？canvas or svg？ 回复内容： 都一些什么答案啊，我看不下去了。题主说的“HTML5的核...
在HTML5中,有个很有用但常被忽略的特性,就是预先加载(prefetch),它的原理是: 利用浏览器的空闲时间去先下载用户指定需要的内容,然后缓存起来,这样用户下次加载时,就直接从缓存中取出来,效率就快了. 举个例子说明:比如要预先加载某个页面,可以这样: XML/HTML Code复制内容到剪贴板link rel="prefetch" href="http://www.example.com/"> 但如果是google的话,要用另外的一个名称,即: XML/HTML Code复制内容到剪贴板link rel="pre...
PC端上传文件多半用插件，引入flash都没关系，但是移动端要是还用各种冗余的插件估计得被喷死，项目里面需要做图片上传的功能，既然H5已经有相关的接口且兼容性良好，当然优先考虑用H5来实现。用的技术主要是：ajaxFileReaderFormDataHTML结构：<p class="camera-area"> <form enctype="multipart/form-data" method="post"> <input type="file" name="fileToUpload" class="fileToUpload" accept="image/*" capture="camera"/...
时光车轮滚滚碾来,前端之路永无止歇.对于这个前端这门精一多专的技术,任何一次技术革新,我们都必须第一时间去了解它学习它,比如Web世界里这簇美艳的花朵---HTML 5.虽然HTML 5发布之初,许多人(包括我)都觉得普及它还很遥远,但自发布以来,许多企业级网站对它的尝试应用(比如应用,比如canvas的应用),使HTML 5的迈出了一大步,随之而来IE9的发布,无疑又让我们看到了HTML 5离我们不再遥远.学习HTML 5半年有余了,虽然对它的离线存储以及ca...
经常使用微博的人会发现，当我们在输入框输入@然后敲一个人的名字，会弹出一个tip提示层，如图所示：出于对这个功能的好奇，并抱着学习的态度，翻阅了一些资料后对这个Javascript进行了探讨和研究。 对这个功能进行分析如下：1、确定光标的位置2、textarea文本框里对字符串@的判断3、tip的弹出事件4、键盘的操作事件5、ajax调用6、文字的插入......当然还有其他的功能。看着是不是感觉很复杂？没关系，我们一步一步的分析。首先我们...
我们曾经被几个读者问到同一个问题——如何将照片传到网上。我认为这是一个很有趣的问题，我决定在本文中解决掉这个问题。但是，我认为只是单纯的实现上传功能可能会有些单调，所以我决定添加一个很重要的元素—剪切功能。相信这样应该更有魅力的说。 html 第一步，我们先画一个表头 现在再描绘主体部分 CSS.bheader { background-color: #DDDDDD; border-radius: 10px 10px 0 0; paddin...
这是一篇如何利用HTML5技术来实现一个带有上传进度条的文件上传功能。它使用XMLHttpRequest对象来上传文件并提供上传过程信息给浏览器客户端。利用这种方案不需要改变原有服务器端的任何代码，这样采用HTML5来代替Flash就方便多了。教程地址：http://www.matlus.com/html5-file-upload-with-progress/示例地址：http://exposureroom.biz/upload.aspx
为什么需要HTML5的桌面通知 传统的桌面通知可以写一个div放到页面右下角自动弹出来，并通过轮询等等其他方式去获取消息并推送给用户。这种方式有个弊端就是：当我在使用京东 进行购物的时候，我是不知道人人网有消息推送过来给我的，而必须要等我把当前页面切到人人网才知道有消息推送了。这种方式的消息推送它是基于页面存活的， 但是我们需要这么一种策略：无论你在看哪个页面，只要有消息都应该能推送给我看到，这就是webkitNot...
上篇文章中提到移动端上传图片，我们知道现在流量还是挺贵的，手机的像素是越来越高，拍个照动不动就是好几M，伤不起。虽然客户端可以轻轻松松实现图片压缩再上传，但是我们的应用还可能在浏览器里面打开，怎么办呢，图片压缩。受以前PC上的开发思维影响，尼玛js哪有权限去操作文件，哪有资格压缩图片啊，搞不了，你们客户端去整吧。只能说自己还是有些井底之蛙了。在HTML5的影响下，前端能干的事情越来越多了，开发的功能逼格也越...
在现实世界中，我们使用画笔在画板上进行绘画；在html5 canvas中，我们同样可以使用canvas的画笔——CanvasRenderingContext2D对象在canvas上进行绘画。众所周知，我们的画笔一般都会与橡皮擦配套使用，以便于纠正绘画过程中的错误并重新绘画。在html5 canvas中，CanvasRenderingContext2D对象也同样给我们提供了一个可以永远重复使用的橡皮擦——clearRect()方法。XML/HTML Code复制内容到剪贴板clearRect(x,...
HTML 5 让 HTML 这个一度单纯的置标语言焕发出成熟的魅力，使之成为 Web 开发者的强力工具。 近日W3C又推出一个新草案——HTML5 File API，这个 API 将让大大改善基于Web 的文件上传操作，甚至可以实现直接将文件从桌面拖放至Web。该草案使用 实现文件的上传，而其对应的 API 为开发者提供了操控上传数据与上传进度的机制。不过，目前对该 API 提供支持的浏览器还少得可怜，真正支持的浏览器似乎只有 Firefox 3.6。如果...
在百度开发者大会上我介绍过HTML5另外一个重要特性就是DeviceOrientation，它将底层的方向传感器和运动传感器进行了高级封装，提供了DOM事件的支持。这个特性包括两种事件：1、 deviceOrientation：封装了方向传感器数据的事件，可以获取手机静止状态下的方向数据，例如手机所处角度、方位、朝向等。2、 deviceMotion：封装了运动传感器数据的事件，可以获取手机运动状态下的运动加速度等数据。使用它我们能够很容易的实现重力感...