HTML5 拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。本章全面介绍这些新的输入类型：1.color2.date3.datetime4.datetime-local5.email6.month7.number8.range9.search10.tel11.time12.url13.week注意:并不是所有的主流浏览器都支持新的input类型，不过您已经可以在所有主流的浏览器中使用它们了。即使不被支持，仍然可以显示为常规的文本域。Input 类型: colorcolor 类型用在input字段主要用于选取颜色，如下...
今天学习vue全局配置。希望帮助我们去了解vue的全局配置，快速开发。Vue.config是vue的全局配置对象。包含Vue的所有全局属性：代码如下：silent:boolean(默认值：false)----取消Vue的所有的日志与警告 ；用法：Vue.config.silent = true optionMergeStrategies：{[key:string]:Function}(默认是空对象{}） vue.config.optionMergeStrategies._my_option = function (parent, child, vm) { return child + 1 }自定义合并策略的选项：...
闲的没事 写个扫雷， 算法 不太好·····凑合，还真的不错，可以看一下<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>扫雷</title> </head> <body><script>function Set(r,c,hard){var data = new Array();for(var i=0;i<r;i++){data[i]=new Array(c);}for (var i = 0; i < r*c; i++){var ran=Math.floor(Math.random()*100);data[Math.floor(i / c)][i % c] =ran<hard?1:0; }return data;}function GetNewData(d...
以前我们在本地存储数据都是用document.cookie来存储的,但是由于其的存储大小只有4K左右,解析也很复杂,给开发带来了诸多的不便.不过现在html5出了web的存储,弥补了cookie的不足,而且开放起来也是相当的方便web存储分两类sessionStorage容量大小约为5M左右,该方式的生命周期为关闭浏览器窗口为止localStorage容量大小约为20M左右, 存储的数据不会随着用户浏览时会话过期而过期，但会应用户的请求而删除。浏览器也因为存储空间的限制...
一开始，在 Web 端，并没有任何可以接触到 clipborad 的内容。以前，我们想要执行 copy/paste/cut 只能借助 flash。但现在，伟大的 H5 又或者说 W3C 推出了关于 H5 操控 clipboard 的草案。最出名的就是两个 API:document.execCommand() ClipboardEvent我们一步一步来了解一下。先来看一下经典 execCommand 的使用。复制操作input 复制我们需要先了解一下，基本的复制过程：选中（select）复制（command + c || ctrl + c）execComm...
html5仿大炮炮弹的自由落体实现 html5的魅力相信大家不会陌生，希望各位大大浏览器们早点支持这个特性哦，，还有先吐槽一句，微信的那个broser简直弱爆了就简单的动画，比如滑动，就jquery的show(1000)，hide(1000)都卡的不行，还是qq浏览器的内核，qq浏览器，，，算了，，我先冷静下。。。。还有就是前几天看到的这个！！！都不支持要他干嘛？？？？？回归主题大炮整体思路就是将每个打出来的炮弹看做一个对象，他的x，y转换成ca...
实现流程：获取<input type="file">上传的文件；使用FileReader读取图片，并新建一个Image对象将FileReader读取的图片数据放进去；使用canvas将Image对象等比缩放并写入到画布中，保存为base64格式的数据（这里使用的是FormData对象上传，其实这里已经可以直接将base64的数据通过ajax使用post方法上传到服务器，即可避免下面两个步骤）；新建一个Blob对象将base64数据放入；使用FormData对象上传到第三方云储存服务器；使用HTML原生...
HTML video 适用于HTML 5+，用于定义在线观看的视频流媒体，这里简单介绍下， 方便需要的朋友HTML <video> 适用于HTML 5+，用于定义在线观看的视频流媒体。<video width ="320" height ="240" src="www.gxlcms.com/movie.ogg" controls="controls">这里是注释文字，如果无法支持 HTML 5 浏览器将显示这里的文字。如果支持，就直接显示视频，忽略文字。</video>在HTML 4 及以前，如果您想在网页中嵌入在线观看的视频，一般都需要使...
一个简单的例子展示了如何从视频中捕获静止图像。下面来看一下假设你有下面的HTML代码：<video id="video" controls="controls"><source src=".mp4" /> </video><button id="capture">Capture</button><p id="output"></p>然后，当用户单击“捕获”按钮，我们将当前的视频内容写入到一个画布，并使用在画布上显示图像。(function() {"using strict";var $video, $output;var scale = 0.25;var initialize = function() {$output = ...
这里主要使用了 HTML5 的 Canvas 进行绘制。利用html5制作人脸的实例代码。先看我们要绘制的人脸效果图：这里主要使用了 HTML5 的 Canvas 进行绘制。下面我们开始整个绘制过程：1. HTML (index.html)<!DOCTYPE html> <html lang="en" ><head><meta charset="utf-8" /><title>HTML5 Face Builder | Script Tutorials</title><link href="css/main.css" rel="stylesheet" type="text/css" /><script src="http://code.jquery.com/jqu...
html5图片上传【文件上传】，在网上找了很多资料，主要也就2种1.from表单提交的方式<form action="pushUserIcon" method="post" enctype="multipart/form-data"> <table> <tr> <td width="50" align=left>图片：</td> <td><input type="file" name="file"/></td> </tr> <tr> <td width="50" align="left">用户id：</td> <td><input type="text" name="userId"/></td> </tr><tr><td><input type="submit"> </...
$velocityCount这是HTML5嵌入视频的简单方法，可以然你快速的将视屏嵌入<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "www.gxlcms.com/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>HTML5 Video Demo</title> </head> <body> <p style="width: 667px; margin: 0 auto;"><video width="667" height="375" controls><source src="FILE_NAME.mp4" type=video/mp4; codecs="avc1.42E01E, mp4a....
桌面提醒的介绍桌面通知功能能够让浏览器即使是最小化状态也能将消息通知给用户。这和WebIM是最为天然的结合。不过，目前支持Desktop Notification功能的浏览器只有Chrome5+。在实际使用的过程中，应该尽量减少通知功能对用户的干扰，最大程度的减少通知功能的出现，这就需要解决以下几个问题：1. 收到多条消息时确保只出现一条通知;2. 当用户处于IM出现的页面中时(页面处于Focus状态)将不出现通知;3. 当用户使用多Tab开启多个存在...
html5数据存储就目前为止实现客户端存储的方式是多种多样，最简单而且兼容性最佳的方案是cookies，但是作为真正的客户端存储，cookies还存在一些不足。大小cookie的大小被限制在4KB。带宽cookie是随http事务一起发送的，因此会浪费一部分发送cookies时使用的带宽。复杂cookies操作起来比较麻烦：所有信息要被拼到一个长字符串里面。联系对cookiess来说，在相同的站点与多事务处理保持联系不是很容易。在这种情况下，在HTML5中重新提...
下雪实例知识点：http://www.gxlcms.com/code/7892.html" target="_blank">canvas画布数组绘画函数效果：源码：------------------------------<!doctype html> <html lang="en"><head><meta charset="UTF-8"><meta name="Generator" content=""><meta name="Author" content=""><meta name="Keywords" content=""><meta name="Description" content=""><title>下雪</title><style> *{padding:0;margin:0} html{overflow:hidden}</...