video
标签支持三种视频格式,Ogg、MPEG 4、webM
Ogg 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件
MPEG4 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件
WebM 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件
在w3c网站有,有一个检测浏览器是否支持video
的事件
function checkVideo(){
if(!!document.createElement('video').canPlayType){
var vidTest=document.createElement("video");
oggTest=vidTest.canPlayType('video/ogg; codecs="theora, vorbis"');
if (!oggTest){
h264Test=vidTest.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"');
if (!h264Test){
document.getElementById("checkVideoResult").innerHTML="Sorry. No video support."
}else{
if(h264Test=="probably"){
document.getElementById("checkVideoResult").innerHTML="Yes! Full support!";
}else{
document.getElementById("checkVideoResult").innerHTML="Well. Some support.";
}
}
}else{
if(oggTest=="probably"){
document.getElementById("checkVideoResult").innerHTML="Yes! Full support!";
}else{
document.getElementById("checkVideoResult").innerHTML="Well. Some support.";
}
}
}else{
document.getElementById("checkVideoResult").innerHTML="Sorry. No video support."
}
}
引用官方的例子
<button onclick="playPause()">播放/暂停</button>
<button onclick="makeBig()">大</button>
<button onclick="makeNormal()">中</button>
<button onclick="makeSmall()">小</button>
<br />
<video id="video1" width="420" style="margin-top:15px;">
<source src="/example/html5/mov_bbb.mp4" type="video/mp4" />
<source src="/example/html5/mov_bbb.ogg" type="video/ogg" />
</video>
<video> 标签的属性
<video>标签的方法
var myVideo=document.getElementById("video1");
播放
myVideo.play();
暂停
myVideo.pause();
调整宽高
myVideo.width=420;
网友评论