随笔分类 -  前台html5

摘要：目前市场上大多数的网站的断点上传都是需要安装浏览器插件的，本文就针对高级浏览器的环境下，通过HTML5 File api实现断点上传进行说明一、实现文件多选HTML5的新增了"multiple"属性，该属性可接受多个值的文件上传字段添加了该属性用户就可以在弹出的对话框中一次性选择多个文件了二、实现文件从计算机拖拽到网页以及添加文件队列功能这里我们用 dragover 和 drop 两个事件来管理文件拖拽的功能其中 dragover 用来处理在指定的元素上移动时的事件，这里我们通过给body绑定dragover时间来处理页面中拖动文件的事件document.body.addE 阅读全文

摘要：本文首先发表在 码蜂笔记 ：http://coderbee.net/index.php/web/20130703/266html5 文件拖拽上传是个老话题了，网上有很多例子，我一开始的代码也是网上找来改的，只是踩了几个坑之后就想把过程记录下来。功能实现下面主要介绍从浏览器外拖拽文件到浏览器进行上传的实现。 首先会介绍一些必须的基础。拖拽事件拖拽事件有下面这些：dragstart：当用户开始拖动对象时触发。dragenter： 当鼠标第一次经过目标元素，且有拖动发生时触发。此事件的监听者应指明在这个位置上是否允许drop，或者监听者不执行任何操作，那么drop默认是不允许的。dragover：当 阅读全文

摘要：继上次学习了HTML5的路径画圆做了动态时钟、异次元空间的反转做了运动的太阳系，这两天将画线、画圆、填充等知识点结合起来做了一个简易的在线画图工具：查看DEMO：HTML5简易在线画图工具功能包括自由画笔、橡皮擦、文字填充、画三角形、画圆等，相对我这个新手来说，感觉挺难的，不过还是参考了资料慢慢“拼”出来了。自由画笔的思路：1234567891011121314151617181920212223242526272829303132333435/******* 自由画笔 *******/function dBrush(n){setStatus(actions,n,1);//鼠标按下的时候var 阅读全文

摘要：原文来自:http://www.williammalone.com/articles/create-html5-canvas-javascript-drawing-app(已被墙)译文:http://fatkun.com/2011/02/html5-canvas-paint.html我也不打算全部翻译了…大部分也看的懂,就算看不懂,代码也能看懂….o(╯□╰)o原谅我非常懒…很久没写博客了.——————-以下是一个简单的例子————————————-html容器首先，准备个容器,也就是画板了。但是，由于IE部分版本还是不支持HTML5，那我们可以借用exCanvas兼容IE..初始化js代码如 阅读全文

摘要：1. 滚动 以下是三种实现方式： 1) 利用原生的css属性 overflow: scroll div id= parent style = overflow:scroll; divid='content'内容区域/div /div Notice: 在android 有bug, 滚动完后会回退到最顶端的内容区域，解决办法是使用后两种方式实现 2)js 编程实现 思路：对比手指在屏幕上移动前后位置变化改变内容元素content 1. 滚动 以下是三种实现方式： 1) 利用原生的css属性 overflow: scroll内容区域 Notice: 在android 有bug, 滚动 阅读全文

摘要：简介我常常想，如果网络应用能够读取和写入文件与目录，将会非常方便。从离线转移到在线后，应用变得更加复杂，而文件系统方面的API的缺乏也一直阻碍着网络前进。存储二进制数据或与其进行交互不应局限于桌面。令人欣慰的是，由于FileSystemAPI的出现，这一现状终于得到了改变。有了FileSystemAPI，网络应用就可以创建、读取、导航用户本地文件系统中的沙盒部分以及向其中写入数据。API 被分为以下不同的主题：读取和处理文件：File/Blob、FileList、FileReader创建和写入：BlobBuilder、FileWriter目录和文件系统访问：DirectoryReader、Fi 阅读全文