黑马程序员技术交流社区

标题: 【郑州校区】Html5视频、音频、API控件笔记第二天 [打印本页]

---

作者: 我是楠楠    时间: 2018-1-24 10:39
标题: 【郑州校区】Html5视频、音频、API控件笔记第二天

【郑州校区】Html5视频、音频、API控件笔记第二天

二、HTML5视频、音频播放事件属性与API控件

1、video、audio标签

<video src = "movie.mp4" controls = "controls"><video>

或者<video controls = "controls">

<source src = "movie.mp4">

<video>

属性	值	描述
autoplay	autoplay（可省略）	视频自动播放
controls	controls（可省略）	向用户显示播放控件
width	px	播放器宽度
height	px	播放器高度
loop	loop、数字	播放完是否继续播放、播放次数
preload	proload	是否等待加载完再播放
src	url	视频url地址
poster	imgurl	加载等待的画面图片
autobuffer	autobuffer	设置为浏览器缓冲方式，不设置autoplay时有效

2、HTML5视频API 控件

（1）获得video标签

①通过DOM对象                var video = document.getElementById("videoID");

②通过jQuery 的方法        var video = $("#videoID")[0];

video标签的属性

载入视频：load()

播放视频：play()

暂停:pause()

快进10秒：currentTime +=10

播放速度增加：playbackRate ++

播放速度增加0.1：playbackRate += 0.1

音量增加：volume += 0.1

静音：muted = true

（3）事件

canplay  

duration 媒体长度

timeupdate  媒体当前位置

三、表单

1、表单输入类型

类型	使用示例	含义
email	<input type="email">	输入邮箱格式
tel	<input type="tel">	输入手机号码格式
url	<input type="url">	输入url格式
number	<input type="number">	输入数字格式
search	<input type="search">	搜索框（体现语义化）
range	<input type="range">	自由拖动滑块
color	<input type="color">	拾色器
time	<input type="time">	小时
date	<input type="date">	年月日
datetime	<input type="datetime">	时间输入框
month	<input type="month">	年月
week	<input type="week">	年周

2、表单元素

元素	含义
<datalist>	数据列表
<keygen>	生成加密字符串
<output>	输出结果
<meter>	度量器

3、表单属性

属性	用法	含义
placeholder	<input type="text" placeholder="请输入用户名">	占位符
autofocus	<input type="text" autofocus>	自动获得焦点
multiple	<input type="file" multiple>	多文件上传
autocomplete	<input type="text" autocomplete="off"> 值：off、on	自动完成
form	<input type="text" form="某表单ID">
novalidate	<form novalidate></form>	关闭验证
required	<input type="text" required>	必填项
pattern	<input type="text" pattern="\d">	自定义验证

更多

【郑州校区】移动web开发笔记day1

【郑州校区】移动web开发笔记day2

【郑州校区】移动web开发笔记day3

【郑州校区】移动web开发笔记day4

【郑州校区】移动web开发笔记day5

【郑州校区】Canvas笔记第一天

【郑州校区】Canvas笔记第二天

【郑州校区】CSS笔记第一天

【郑州校区】CSS笔记第二天

【郑州校区】CSS笔记第三天

【郑州校区】CSS笔记第四天

【郑州校区】CSS笔记第五天

【郑州校区】Html笔记第一天

传智播客·黑马程序员郑州校区地址

河南省郑州市 高新区长椿路11号大学科技园（西区）东门8号楼三层

联系电话 0371-56061160/61/62

来校路线  地铁一号线梧桐街站A口出

---

作者: 我是媛媛    时间: 2018-1-24 17:28
收藏啦

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2