video 元素支持三种视频格式
IE Firefox Opera Chrome Safari 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件 No 3.5+ 10.5+ 5.0+ No 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件 9.0+ No No 5.0+ 3.0+ 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件 No 4.0+ 10.6+ 6.0+ No
1、设置一个ogg格式的文件
您的浏览器不支持 video 标签。
执行如下:
当浏览器不支持ogg格式时则显示[您的浏览器不支持 video 标签。]
2、设置多种格式
您的浏览器不支持 video 标签。
执行如下:
如上图为视频设置一个默认图片。也可以添加其他属性。
标签的属性如下:
controls/controls="controls" 显示播放按钮
autoplay/autoplay="autoplay" 立即播放
loop/loop="loop" 循环播放
muted/muted="muted" 静音
preload/preload="preload" 加载视频d
poster="路径" 显示默认图片
3、自定义播放暂停及大小( Video + DOM )
播放/暂停
更改大小
您的浏览器不支持 video 标签。
将javascript写在html的下方
var myVideo=document.getElementById("video1");
function playPause()
{
i f (myVideo.paused)
myVideo.play(); //播放
else
myVideo.pause(); //暂停
}
function makeNormal()
{
myVideo.width=420; //自定义宽度,高度自适应
}
执行如下:
大多数浏览器支持的视频方法、属性和事件(日后在做理解)
方法 属性 事件 play() currentSrc play pause() currentTime pause load() videoWidth立即执行--视频元素前执行 progress canPlayType() videoHeight立即执行--视频元素前执行 error duration timeupdate ended ended error abort paused empty muted emptied seeking waiting volume loadedmetadata height width
下方为html5 视频和音频的方法属性和事件参考
http://www.w3school.com.cn/tags/html_ref_audio_video_dom.asp
查看更多关于HTML5视频(video)-LoveSuk的详细内容...