H5 video
source 标签
如果播放失败 video
会继续看下一个source
标签,直到兼容。
<video>
<source src="">
<source src="">
浏览器不支持 请升级
</video>
video标签属性
src
视频的资源地址
width
改变视频宽度
height
改变 视频高度
controls
播放控件
autoplay
自动播放
loop
循环播放
poster
视频封面,没有播放时显示的图片(视频刚加载时没有播放)
muted
当设置改属性后,它规定视频的音频输出应该被静音
videoAPI事件
play(方法)
使其播放状态,在chrome浏览器不允许浪费电的带声音播放
pause(方法)
使其暂停状态
load(方法)
强制播放器重新加载(一般会用于在改变src地址后,重新加载一下)
RequestFullscreen(方法)
全屏化函数,用户必须主动调用才行
duration(对象属性)
返回视频的总长度,js对其显示和调整
currenttime(对象属性)
返回当前时间视频位置,通过js设置播放位置,实现快进效果(以秒的形式)
volume(对象属性)
声音大小从0到1,默认最大音量为1,可以用<input type="range">
取代并设置默认样式
loop(对象属性)
是否循环播放
是否循环播放(true,false),js通过按钮传递值操作是否循环(音乐)
playbackRate(对象属性)
查看或设置视频的播放速度
currentsrc(对象属性)
当前视频的位置状态
在加载能播放后才能返回地址,只能返回视频地址,不能赋值(与src的区别)
networkStateP(对象属性)
获取视频的网络状态
0 未初始化
1 视频已加载完毕 但是未使用网络(本地视频?)
2 浏览器正在下载视频资源
3 未找到视频资源
readyState(对象属性)
返回视频当前状态
0:还没获取到就绪信息
1:有数据,但是快不足以支撑
2:当前数据可用,但是没有数据来播放下一帧
3:数据正在缓冲,当前及至少下一帧可用
4:可用数据足以开始播放了
canplay(事件)
视频已经加载好开始播放了
ended(事件)
监听视频是否播放结束
timeupdate(事件)
可以监听到视频目前的播放状态
监听视频目前的播放状态,如果播放就会自动执行函数内容,不播放则相反
volumnchang(事件)
当视频声音发生改变时触发事件
seeked(事件)
拖动进度条完成时就会触发的事件
当用户对视频的进度条并且已经完成操作时会触发的事件