HTML5
唐小狼
“人们称赞我是最勤奋的人,如果思考也算劳动的话,或许的确如此,因为一天之中从睁开眼,我几乎一直在思考。但是,如果工作被认为是在特定时间,根据狭隘标准从事某些特定活动的话,那么或许我是最懒惰的家伙。”
展开
-
Canvas3——绘制渐变图形与绘制变形图形
1、Canvas绘制渐变图形(1)绘制线性渐变createLinearGradient()**CanvasRenderingContext2D**.createLinearGradient()方法创建一个沿参数坐标指定的直线的渐变。该方法返回一个线性 CanvasGradient对象。CanvasGradient _ctx_.createLinearGradient(x原创 2016-05-10 17:37:01 · 1687 阅读 · 0 评论 -
HTML5——Range对象(1)
2016-04-27 15:22:55 星期三1、Range对象(1)selectNode、SelectNodeContents、deleteContents方法setStart、setEND、setStartBefore、setStartAfter、setEndBefore、setENDAfter方法(2)基本概念:一个Range对象代表页面上的一段连续区域。通过Rang原创 2016-05-04 09:41:36 · 1531 阅读 · 0 评论 -
HTML5——Range对象(2)
2016-04-28 13:56:44 星期四1、cloneRange、cloneContents、extractContents方法 id="p">这里是随便书写的内容 onclick="cloneRange()">克隆 function cloneRange() { var rangeObj = document.createRange(); ra原创 2016-05-04 09:43:33 · 665 阅读 · 0 评论 -
HTML5——拖放
HTML5拖放1、HTML5拖放拖放(Drag和drop)是HTML5标准的组成部分。2、拖动开始:ondragstart:调用了一个函数,drag(event),它规定了被拖动的数据3、设置拖动数据setData():设置被拖数据的数据类型和值。4、放入位置:ondragover:事件规定在何处放置被拖动的数据。5、放置:原创 2016-05-05 09:13:08 · 1528 阅读 · 0 评论 -
HTML5——本地资源拖放
HTML5本地资源拖放 lang="en"> charset="UTF-8"> 本地拖放 #imgContainer{ background-color: #cccccc; width:500px; height:500px; } src="app1.js">原创 2016-05-06 10:23:50 · 589 阅读 · 0 评论 -
HTML5——音频视频
音频播放1、Audio(音频)HTML5提供了播放音频文件的标准2、control(控制器)control属性提供了播放、暂停和音量控件3、标签定义声音规定多媒体资源,可以是多个 src="1.mp3" controls="controls">您的浏览器不支持 onclick="clickA()">播放/暂停 id="audio"原创 2016-05-05 09:08:14 · 438 阅读 · 0 评论 -
Canvas5——路劲应用绘制动画效果初级
Information利用Canvas路径api绘制线与圆,让圆沿着线的方向运动。实现原理很简单,就是不断的清楚画布,然后再重新绘制各个组件。当然,这个逻辑也是制作大部分动画的根本逻辑。有一些复杂的动画会用到store()函数,对画布上的元素进行存储,不完全清除掉,以后就会接触到了。这个代码的效果可以看这里:演示效果代码如下: xmlns="http://ww原创 2016-05-18 17:15:01 · 1593 阅读 · 0 评论 -
CSS3中的动画效果
1、transition示例代码: lang="en"> charset="UTF-8"> transition div{ background-color: #ffff00; color: black; transition:background-color 3s linear,co原创 2016-05-19 08:27:19 · 521 阅读 · 0 评论 -
HTML5——新增表单元素与属性(3)
2016-04-29 14:48:49 星期五1、表单内元素的form属性在HTML4中,表单内的从属性必须书写在表单内部,而在HTML5中,可以把他们书写在页面上任何地方,然后为该元素指定一个form属性,属性值为该表单的id,这样就可以声明该元素从属于指定表单了。2、表单内元素的formaction属性在HTML4中,一个表单内的所有元素只能通过表单的actio原创 2016-05-03 09:03:59 · 713 阅读 · 0 评论 -
HTML5——新增表单元素与属性(2)
2016年4月24日, 星期日1、标签的control属性在HTML5中,可以在标签内部放置 一个表单元 素,并且通过该标签的control属性来访问该表单元素。2、文本框的placeholder属性placeholder是指当文本框处于未输入状态时显示的输入提示。当文本框处于未输入状态且未获取光标焦点时,模糊显示输入提示文字。3、文本框的list属性原创 2016-05-03 09:02:52 · 637 阅读 · 0 评论 -
HTML5——表单新增元素与属性(1)
2016-04-26 09:38:55 星期二1、文本框的pattern属性在HTML5中,对input元素使用pattern属性,并且将属性值设为某个格式的正则表达式,在提交时会针对这些进行检查,检查其内容是否符合给定格式。当输入的内容不符合给定格式时,则不允许提交,同时在浏览器中显示信息提示文字,提示输入的内容必须符合给定格式。2、文本框的SelectionDirect原创 2016-05-03 09:00:36 · 625 阅读 · 0 评论 -
Canvas——认识CreateJs库
1、CreateJsA suite of modular libraries and tools which work together or independently to enable rich interactive content on open web technologies via HTML5.简单认识实例: lang="en"> charset="UT原创 2016-05-11 09:23:30 · 1212 阅读 · 1 评论 -
HTML5——web存储
1、客户端存储数据的新方法(1)localStorage方法——没有时间限制的数据存储(2)sessionStorage方法——针对一个session的数据存储(a)与cookie做对比:之前,这些都是由cookie完成的。但是cookie不适合大量数据的存储,因为它们由每个队服务器的请求来传递,这使得cookie速度很慢而且效率也不高。2、localStorage原创 2016-05-12 08:54:48 · 405 阅读 · 0 评论 -
Canvas4——图形绘制处理
1、图形组合globalCompositeOperation = type 属性" class="reference-link " style="padding:0px; margin:0px; color:rgb(65,131,196); background-color:transparent">globalCompositeOperation = type 属性**Can原创 2016-05-10 17:38:14 · 961 阅读 · 0 评论 -
Canvas2——使用路径
1、绘制圆形 lang="en"> charset="UTF-8"> canvas1 function draw(id){ var canvas = document.getElementById(id); if(canvas == null){ return false;原创 2016-05-10 08:11:02 · 908 阅读 · 0 评论 -
HTML5——应用缓存与Web Workers
1、应用缓存(1)什么是应用程序缓存:HTML5引入了应用程序缓存,这意味着web应用可进行缓存,并可在没有因特网链接时进行访问(2)应用缓存的优势:a:离线浏览-用户可在应用离线时使用它们b:速度-已缓存资源加载得更快c:减少服务器负载-浏览器将只从服务器下载更新过或更改过的资源(3)实现缓存:如需启用应用程序缓存,请在文档的标签中包含manifest属性。原创 2016-05-14 09:41:27 · 608 阅读 · 0 评论 -
HTML5——响应式布局
1、响应式布局介绍(1)响应式布局:响应式布局是2010年5月份提出的一个概念,简而言之,就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。这个概念是为解决移动互联网浏览而诞生的。其目的是为用户提供更加舒适的界面和更好的用户体验。(2)优缺点:优点1) 面对不同分辨率设备灵活性强2) 能够快捷解决多设备显示适应问题缺点1) 兼容各种设原创 2016-05-16 14:11:34 · 738 阅读 · 0 评论 -
HTML5——Canvas基本介绍
1、Canvas标签HTML5元素用于图形的绘制,通过脚本(通常是JavaScript)来完成。标签只是图形容器,你必须使用脚本来绘制图形。可以通过多种方法使用Canvas绘制路径、盒、圆、字符以及添加图形。2、标签创建(1)脚本创建: lang="en"> charset="UTF-8"> canvas .canvas{原创 2016-05-06 10:25:49 · 450 阅读 · 0 评论 -
HTML5——增强页面元素
2016-04-26 15:55:14 星期二1、figure元素一个figure元素只能包含一个figcaption标题,但可以包含多个其它元素。2、details和summary元素 lang="en"> charset="UTF-8"> details id="details"> 速度与激情7 id="p">你好原创 2016-05-03 08:58:14 · 785 阅读 · 0 评论 -
Canvas1——基础api实验
lang="en"> charset="UTF-8"> canvas src="app.js"> var CANVAS_HEIGHT = 500, CANVAS_WIDth = 500;var mycanvas, context; window.onload = function () { createCanvas(); drawRect();} functi原创 2016-05-10 08:10:18 · 561 阅读 · 0 评论