今天，看一个国外网站发现人家获取head元素如下 代码如下:var head = document.head || document.getElementsByTagName(head)[0]; 后面的是我们常用的方式，前面的 document.head 着实第一次见。查资料发现原来是html5的东东。的确简单了，一个属性搞定。 当然，IE6/7/8不支持。IE9/Safari/Chrome/FF/Opera均支持（最新版本）。记录下。 html4中HTMLDocument接口如下html5中HTMLDocument接口如下相关： http://www.w3.org/TR/DOM-L...
html5的一个非常cool的功能，就是web storage，类似于之前的cookie，不过与之不同的是，web storage 拥有本地5兆的容量可以存储，而cookie却只有4K，这是完全不能比的优势。webstrange又分为：localstorage，sessionstorage和本地数据库。接下来我就来一一介绍：1、localstorage localstorage 的使用比较简单，方法有：代码如下: localStorage.setItem(key,value);//保存数据 localStorage.getItem(key);//读取数据 localStorage.r...
移动设备和桌面电脑上的客户端API起初并不是同步的。最初总是移动设备上先拥有某些功能和相应的API，但慢慢的，这些API会出现在桌面电脑上。其中一个应用接口技术就是getUserMedia API，它能让应用开发者访问用户的摄像头或内置相机。下面就让我展示一下如何通过浏览器来访问你的摄像头，并提取截屏图形。 HTML代码 下面的代码里我写了一部分注释，请阅读：代码如下:理想情况下我们应该先判断你的设备上是否有摄像头或相机，但简单...
一、 Data URI scheme 简介 Data URI scheme是在RFC2397中定义的，目的是将一些小的数据，直接嵌入到网页中，从而不用再从外部文件载入。比如上面那串字符，其实是一张小图片，将这些字符复制黏贴到火狐的地址栏中并转到，就能看到它了，一张1X36的白灰png图片。在上面的Data URI中，data表示取得数据的协定名称，image/png 是数据类型名称，base64 是数据的编码方法，逗号后面就是这个image/png文件base64编码后的数据。或许你已经...
HTML5图片预览需要用到两种方法1.URL 2.FileReader直接上代码 代码如下: html5 图片上传预览 #preview { width: 300px; height: 300px; overflow: hidden; } #preview img { width: 100%; height: 100%; } function preview1(file) { var img = new Image(), url = img.src = URL.createObj...
代码如下: HTML5雨滴特效 img { display: none; } body { overflow: hidden; } #canvas { position: absolute; top: 0px; left: 0px; } function demo() { var engine = new RainyDay('canvas','demo1', window.innerWidth, window.innerHeight); engine.gravity = engine.GRAVITY_NON_LINEAR; engine.trail = engine.TRAIL_DROPS; engine.rain([ engine.preset(0, 2, 500) ]); engine.rain([ engine.preset(3, 3, 0.88), en...
实际上，确实有人会谈到规范的内容。史蒂夫·福克纳（Steve Faulkner）会讲HTML5与可访问性。而保罗·艾里什（Paul Irish）则会讲HTML5提供的各种API。因此，我今天站在这里，不会光讲一讲HTML5就算完事了。 说老实话，在正式开始之前，我想先交待清楚我所说的HTML5到底是什么意思。这话听起来有点搞笑：这会子你一直在说HTML5，难道我们还不知道什么是HTML5吗？大家知道，有一个规范，它的名字叫HTML5。我所说的HTML5...
现在的手机或平板电脑等移动设备上的浏览器默认都有双击放大的设置，怎么让双击不放大？ 在Mobile页面上有提供viewport这个meta，可以用它来设置缩放。 但是在使用viewport之前要把页面的文档类型改成Mobile类型。 通常的页面DTD都是XHTML或者简单的HTML5声明，移动设备要用下面这个声明。代码如下:设置了DTD之后就可以使用viewport使页面禁止缩放了。 通常把user-scalable设置为0来关闭用户对页面视图缩放的行为。代码如下:但是为...
记得引用jquery 类库 代码如下: $(document).ready(function () { if ($.browser.msie) $("input:text,input:password").each(function () { var $placeholder = $(this).attr("placeholder"); var $width = $(this).css("width"); var $id = $(this).attr("id"); var $height = parseInt($(this).css("height")) + 6 + "px"; var $fontSize = $(this).css("font-size"); var $fontWeight = $(this).css("font-weight"); var $line...
HTML5 创建canvas元素 代码如下: 声明必须是 HTML 文档的第一行，位于 标签之前。 HTML5 function pageLoaded() { alert('HTML5 页面加载完毕!'); } 提示：你的浏览器不支持标签 html代码教程/参考手册 html代码热搜 Readonly和Disabled之间的微小区别详解如何设置select只读不可编辑且select的值可传递html中radio值的获取、赋值、注册事件示例详解textarea标签大小不可变不能通过鼠标拖动的方式来拖...
一、绘制矩形 canvas使用原点(0,0)在左上角的坐标系统，x坐标向右递增，y坐标向下递增。 使用绘图环境的矩形绘制函数来绘制矩形。 fillRect(x,y,width,height) ： 绘制一个实心的矩形。 strokeRect(x,y,width,height) ： 绘制一个空心的矩形。 clearRect(x,y,width,height) ： 清除指定的矩形区域，使之完全透明。 二、在canvas中绘制矩形 代码如下: 声明必须是 HTML 文档的第一行，位于 标签之前。 HTML5 //这个函数将在页...
假设div里有这么些内容： 代码如下: iScroll demo: simple function deleteData(){ } body,ul,li { padding:0; margin:0; border:0; } body { font-size:12px; -webkit-user-select:none; -webkit-text-size-adjust:none; font-family:helvetica; } Pretty row 1 Pretty row 2 Pretty row 3 Pretty row 4 Pretty row 5 Pretty row 6 Pretty row 7 Pretty row 8 Pretty row 9 Pretty row 10 Pretty row 40 现在要...
代码如下: var cID = "c1"; var image = new Image(); image.src = "Eye/item_eye_1.png"; image.onload = function () { recolorImage(cID,image, 0, 0, 0, 255, 0, 0); } function recolorImage(c,img, oldRed, oldGreen, oldBlue, newRed, newGreen, newBlue) { var c = document.getElementById(c); var ctx = c.getContext("2d"); var w = img.width; var h = img.height; c.width = w; c.height = h; // draw the image on...
使用HTML5+jQuery，不使用FLASH： 浏览器适用范围：Firefox 3.5+, Chrome 3+, Opera 10.5+, Safari 4+, IE 9+ 代码示例： 代码如下: $("#speak").mouseenter(function(){ $("").attr({ src:audio/+Math.ceil(Math.random() * 5)+.mp3, volume:0.4, autoplay:autoplay }).appendTo("body"); }); 上面是使用html5的audio元素，随机播放一个mp3音效。 该代码示范（使用了jQuery）来自goodfootapp.com首页。
今天，我们继续分享 JavaScript 实现的效果例子，这篇文章会介绍使用 JavaScript 实现水波纹效果。水波效果以图片为背景，点击图片任意位置都会触发。有时候，我们使用普通的 Javascript 就可以创建一个很有趣的解决功能。 源码下载Step 1. HTML 和以前一样，首先是 HTML 代码： 代码如下: Water drops effect Water drops effect HTML5 compliant browser required Step 2. CSS 这是用到的 CSS 代码： 代码...