html5
文章平均质量分 80
玉超
这个作者很懒,什么都没留下…
展开
-
html5的拖拽
h5中drag事件 代替原先的mousedown mouseover mouseup事件实现完美拖拽; 拖拽事件有如下几种:dragstart,dragend,dragenter,dragover,dragleave,drop;其中前两个事件对应的元素为拖拽元素,后面几个都是对应目标对象元素;HTML5支持拖拽数据存储,使用dataTransfer接口,作用于元素的拖拽基础原创 2013-10-23 13:38:31 · 1467 阅读 · 0 评论 -
移动webApp大前端(二)
响应式布局:在上一篇文章中先介绍了viewport以及媒体标签的用法,利用viewport检测当前运行环境浏览器视口大小,然后用@media进行有针对性的编写样式。接下来我们继续深入一起探讨webApp的必备之---响应式布局:sorry,先缓一缓,我们先来说一下webApp吧,算是对上一篇的补充。webApp区别于传统web开发,也有别于应用App。它是伴随智能手机的普及而流行的原创 2014-03-27 15:19:49 · 1029 阅读 · 0 评论 -
canvas讲解进阶篇五
进阶三篇我们讲过了剪裁缩放 所用到的canvas方法也就是drawImage,我们也知道了drawImage方法有三套用法可以直接将图像放置于绘图环境、可以将图像缩放放置于绘图环境也可以将图像剪裁后放置绘图环境。利用我们讲过的图像剪裁缩放可以制作背景图片滚动效果,例如制作游戏程序时候背景图片的部分显示等功能。大家可以发散思维的。这篇文章主要讲图像制作包含两个大部分:离屏canvas以及原创 2013-11-13 15:53:28 · 3240 阅读 · 2 评论 -
websocket驾到
在没有websocket之前,大家都如何实现信息推送的呢?很久很久以前有个技术叫推送,使用的概念叫Webcasting。大体意思就是用户来服务端注册一个或者多个通道,然后服务端确定给某些个通道或某个通道发送消息。很久以前有个flash技术,利用flash插件与服务端进行相互推送。不久以前有个comet,比如有Polling、Long Polling(当有消息的时候才返回),至于HTTP发起是在原创 2013-10-25 12:06:49 · 2782 阅读 · 1 评论 -
html5之多文件拖拽上传预览
最近对于html5预览功能很是感兴趣,特地拿出来研究一小下,并以一个小项目举例讲解。 h5中的input有个type=file 就是文件上传控件,有个属性multiple就是h5新增的支持多选上传文件。用法很简单:下面着重探讨一下拖拽上传并预览。-----------------------------------------------------------原创 2013-10-23 13:55:12 · 3998 阅读 · 0 评论 -
js之文件上传(含进度条,回调)向下兼容
之前分享过一篇拖拽上传预览的实现是基于html5的,在那篇文章中,我们实现了拖拽预览,对于上传并没有特别提及到:这篇算作对文件上传的补充吧在html5之前我们上传文件一般都会用form表单进行提交,from.submit()即可ok,添加需求如下:1.上传成功后执行回调函数2.上传过程显示上传进度条这两种需求都不为过,很多现实中都会需要用到如果是ajax上传就可以很简单的实原创 2013-12-16 16:26:49 · 4837 阅读 · 0 评论 -
canvas讲解进阶篇四
贝塞尔曲线、坐标变换以及图像合成我们之前说过:canvas的元素大小与绘图环境大小不一定相同,例如我们通过css定义canvas的宽高后,改变的只是canvas元素的宽高,而绘图环境的宽高还是不变的,当我们在canvas内部作图时候,绘图环境会默认的缩放到canvas元素大小,这时候如果我们绘制1像素那么该1像素就会被缩放同样倍数。很多时候我们需要根据用户鼠标位置去操作canvas环境。这原创 2013-11-12 14:42:37 · 1540 阅读 · 0 评论 -
canvas讲解进阶篇二
上篇我们讲解过canvas的基础图形绘制,包括线段矩形以及圆弧。看上去这三个组合能完成很多东西(毕竟不是ps),但是实际canvas功能很强大的,可以实现ps中大部分功能,甚至在js控制下完成flash的东东。这一篇我们讲解的东西不是为了让canvas多么绚丽,而是在实际中我们的画布不能那么光秃秃黑乎乎的,总要有点颜色效果吧,这叫做客户体验。哈哈下面我们依次来说说canvas的颜色(填充透原创 2013-11-06 17:35:20 · 1405 阅读 · 1 评论 -
canvas讲解进阶篇三
承上启下:上篇我们说过了canvas中绘图的颜色阴影以及渐变操作,这些有时候是给我们绘图锦上添花有时候是审美需要,无论如何 都是canvas不可获取的一部分,canvas中还有一些操作可以为你实现比较复杂的效果例如文本书写、剪裁缩放、以及图像合成、滤镜通道(后续)等。这篇文章主要为大家介绍一下文本以及剪裁缩放。文本文本的描边与填充在实际操作时候跟其他基本图形一样,只是调用方法有所不同,原创 2013-11-08 14:50:58 · 1903 阅读 · 1 评论 -
canvas讲解进阶篇一
html5中最强大的武器当属canvas莫属。从文字处理到电子游戏,canvas都会提供给你而且总体而言运行速度相当快,而且编码良好的canvas应用程序无需修改即可在任何兼容html5浏览器中进行运行。偶尔因为canvas更新而浏览器版本跟不上导致细微差别。而针对低版本ie的兼容我们过会儿再说。我们先从canvas基本开始走起:实现canvas首先要在页面中定义一个canvas元素,原创 2013-11-06 14:02:41 · 2472 阅读 · 3 评论 -
HTML5之Web Worker
Web Worker是什么:web worker是html5提供的一个多线程解决方案,(以下我们简称为wWorker),大家都知道js是单线程执行的,所谓多线程解决方案也就是不需要js在执行时候摁着一个线程可劲使用,比如有些时候我们不小心会弄出死循环 或者大量计算时候,浏览器就会在它执行的线程中去执行我们的计算,从而导致ui渲染线程挂起浏览器就over了,这就是单线程处理的结果,多线程原创 2013-11-18 16:06:26 · 1086 阅读 · 0 评论 -
webstorage vs cookie
sessionStorage以及localStorage都是html5定义的apifagn原创 2014-05-15 16:43:18 · 1373 阅读 · 0 评论