![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTML5
iteye_5722
这个作者很懒,什么都没留下…
展开
-
HTML5 简介
HTML5是HTML最新的修订版本,2014年10月由万维网联盟(W3C)完成标准制定。HTML5的设计目的是为了在移动设备上支持多媒体。HTML5 简单易学。一 什么是 HTML5HTML5 是下一代 HTML 标准。HTML , HTML 4.01的上一个版本诞生于 1999 年。自从那以后,Web 世界已经经历了巨变。HTML5 仍处于完善之中。然而,大部分现代浏览...2017-04-06 20:51:43 · 110 阅读 · 0 评论 -
HTML5的音频和视频监听器应用
一 介绍1、<audio>和<video>元素有不少监听事件,因此可以绑定这些事件的监听器。2、本应用实现<video>的ontimeupdate事件的监听器。3、通过ontimeupdate事件绑定监听器可以实时监控音频、视频的播放位置。 二 代码<!DOCTYPE html><html><...2017-04-12 19:04:25 · 182 阅读 · 0 评论 -
使用JavaScript脚本控制媒体播放
一 介绍1、在HTML页面中获取<audio>和<video>元素播放音频和视频之外,很多时候我们还需要JavaScript来控制这些元素的播放。2、在JavaScript中获取<audio>元素对应的对象为HTMLAudioElement的对象,<vidio>元素对应的对象为HTMLVideoElement对象。3、HTMLAudio...2017-04-11 20:49:13 · 199 阅读 · 0 评论 -
HTML5的video元素和audio元素兼容性
一 介绍因为各浏览器对音频和视频的支持互不相同,开发者可能希望为<video>和<audio>元素指定多个媒体源,此时可以借助<source>子元素来实现。 二 代码<!DOCTYPE html><html><head> <meta name="author" content2017-04-11 20:46:58 · 176 阅读 · 0 评论 -
HTML5的video元素应用
一 介绍HTML5 <video> 元素是一个HTML5元素,在HTML4中是非法的,但在所有浏览器中都有效。该元素使用非常简单,举例如下 二 代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.org...2017-04-10 20:32:01 · 114 阅读 · 0 评论 -
HTML5的audio元素应用
一 介绍HTML5 <audio> 元素是一个HTML5元素,在HTML4中是非法的,但在所有浏览器中都有效。该元素使用非常简单,举例如下 二 代码<!DOCTYPE html><html><head> <meta name="author" content="Yeeku.H.Lee(CrazyIt.o...2017-04-10 20:23:43 · 100 阅读 · 0 评论 -
Canvas 输出位图
一 介绍toDataURL()是canvas中将图片的二进制格式转为dataURL格式使用的方法。dataURL是将数据按base64进行编码,它是一种保存二进制的方式。下面通过这种方法输出位图。 二 代码<!DOCTYPE html><html><head> <meta name="author" content...2017-04-09 08:13:38 · 235 阅读 · 0 评论 -
Canvas 像素处理之高亮处理
一 定义和用法getImageData()方法返回 ImageData 对象,该对象拷贝了画布指定矩形的像素数据。注意:ImageData对象不是图像,它规定了画布上一个部分(矩形),并保存了该矩形内每个像素的信息。对于ImageData对象中的每个像素,都存在着四方面的信息,即RGBA值:R - 红色(0-255)G - 绿色(0-255)B - 蓝色(0-255)...2017-04-09 08:06:25 · 337 阅读 · 0 评论 -
Canvas 位图裁剪
一 位图裁剪方法1、将需要从位图上裁剪的部分定义成Canvas的路径。2、调用CanvasRenderingContext2D的的clip()方法把路径剪切出来。3、绘制位图——此时只要被clip()的路径覆盖的部分才会被显示出来。二 代码<!DOCTYPE html><html><head> <meta name="...2017-04-08 08:58:14 · 105 阅读 · 0 评论 -
Canvas 像素处理之改变透明度
一 定义和用法getImageData()方法返回 ImageData 对象,该对象拷贝了画布指定矩形的像素数据。注意:ImageData对象不是图像,它规定了画布上一个部分(矩形),并保存了该矩形内每个像素的信息。对于ImageData对象中的每个像素,都存在着四方面的信息,即RGBA值:R - 红色(0-255)G - 绿色(0-255)B - 蓝色(0-255)...2017-04-08 08:56:18 · 297 阅读 · 0 评论 -
Canvas 位图填充
一 位图填充方法1、调用createPattern方法创建位图填充,该方法返回一个CanvasPattern对象。2、将CanvasPattern对象赋值给CanvasRenderingContext2D的fillStyle或StrokeStyle属性。二 代码<!DOCTYPE html><html><head> <me...2017-04-07 19:08:21 · 148 阅读 · 0 评论 -
Canvas 圆形渐变
一 介绍渐变可以填充在矩形, 圆形, 线条, 文本等等, 各种形状可以自己定义不同的颜色。以下是设置Canvas圆形渐变的方法:createRadialGradient(x,y,r,x1,y1,r1) - 创建一个圆形渐变。当我们使用渐变对象,必须使用两种或两种以上的停止颜色。addColorStop()方法指定颜色停止,参数使用坐标来描述,可以是0至1.使用渐变,设置f...2017-04-07 19:01:21 · 314 阅读 · 0 评论 -
Canvas 线性渐变
一 介绍渐变可以填充在矩形, 圆形, 线条, 文本等等, 各种形状可以自己定义不同的颜色。以下用来设置Canvas的线性渐变:createLinearGradient(x,y,x1,y1) - 创建线条渐变。当我们使用渐变对象,必须使用两种或两种以上的停止颜色。addColorStop()方法指定颜色停止,参数使用坐标来描述,可以是0至1。使用渐变,设置fillStyle...2017-04-06 20:55:10 · 135 阅读 · 0 评论 -
谷歌浏览器查看HTML文档和DOM视图的对应关系
一 打开谷歌浏览器,按照下图步骤打开【开发者工具】。 二 观察下图,DOM模型中的各个DOM节点,与HTML文档中各个HTML元素正好一一对应。2017-04-12 19:08:48 · 352 阅读 · 0 评论