多媒体技术
音频标签
音频标签
支持格式有限,主要支持三种格式
1.Ogg Vorbis(常用)
2.MP3(常用)
3.Wav
属性:
1.autoplay=“autopaly”(音频在就绪后马上播放,谷歌浏览器禁用了自动播放)
2.controls=“controls”(向用户显示控件,比如播放按钮,不同浏览器显示控件不同)
3.loop=“loop”(音频结束时重新开始播放)
4.src=””(要播放的文件名)
因为不同浏览器支持不同格式,我们需要为这个音频准备多个格式
视频标签
视频标签 video
格式:
1.Ogg(常用)
2.MPEG 4(常用)
3.WebM
解决兼容性:
您的浏览器不支持video标签
常见属性:
autoplay=“autoplay”(自动播放,谷歌禁止自动播放,需添加muted=“muted”(静音播放)属性才能自动播放)
controls=“controls”(显示播放控件)
width=”…px”(播放器宽度)
height=”…px”(播放器高度)
loop=“loop”(循环播放)
preload=“proload”(是否等加载完再播放)
src=“url”(视频地址)
poster=“imgurl”(加载等待的画面图片)
muted=“muted”(静音播放)
视频和音频的方法事件
方法 | 描述 |
---|---|
addTextTrack() | 为音视频加入一个新的文本轨迹 |
canPlayType() | 检查指定的音视频格式是否得到支持 |
load() | 重新加载音视频标签 |
play() | 播放音视频 |
pause() | 暂停播放当前的音视频 |
事件 | 描述 |
---|---|
abort | 当音视频加载被异常终止时产生该事件 |
canplay | 当浏览器可以开始播放该音视频时产生该事件 |
canplaythrough | 当浏览器可以开始播放该音视频到结束而无需因缓冲而停止时产生该事件 |
durationchange | 当媒体的总时长改变时产生该事件 |
emptied | 当前播放列表为空时产生该事件 |
ended | 当前播放列表结束时产生该事件 |
error | 当加载媒体发生错误时产生该事件 |
loadeddata | 当加载媒体数据时产生该事件 |
loadedmetadata | 当收到总时长,分辨率和字轨等metadata时产生该事件 |
loadstart | 当开始查找媒体数据时产生该事件 |
pause | 当媒体暂停时产生该事件 |
play | 当媒体播放时产生该事件 |
playing | 当媒体从因缓冲而引起的暂停和停止恢复到播放时产生该事件 |
progress | 当获取到媒体数据时产生该事件 |
ratechange | 当播放倍数改变时产生该事件 |
seeked | 当用户完成跳转时产生该事件 |
seeking | 当用户正执行跳转时操作的时候产生该事件 |
stalled | 当试图获取媒体数据,但数据还不可用时产生该事件 |
suspend | 当获取不到数据时产生该事件 |
timeupdate | 当前播放位置发生改变时产生该事件 |
volumechange | 当前音量发生改变时产生该事件 |
waiting | 当视频因缓冲下一帧而停止时产生该事件 |