HTML5视频
浏览数：28 /
时间：2015年06月09日
<video>标签用于定义视频。
案例1：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<video width="300" height="300" controls="controls">
<source src="gsd.mp4" type="video/mp4">
<source src="gsd.ogg" type="video/ogg">
您的浏览器不支持video标签
</video>
</body>
</html>
效果图1（浏览器支持）
效果图2（浏览器不支持）
注释：
（1）controls 用于向用户显示播放、暂停和音量按钮，属性值为：controls；
（2）autoplay 用于控制视频就绪后马上播放，属性值为：autoplay；
（3）loop 用于控制视频播放完成后再次开始播放，属性值为：loop；
（4）preload 用于控制视频在页面加载时进行加载，准备播放，若已经使用“autoplay”，则忽略该属性，属性值为：preload；
（5）src 视频链接，video元素允许多个格式不同的source元素，浏览器将会使用第一个可识别的格式；
（6）可以在<video></video>之间放置文本内容，这样浏览器可以显示不支持此标签的相关信息；
（7）<video>拥有方法、属性及事件play()、pause()等，案例如下：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script>
function clickA(){
var a = document.getElementById("ex_1");
if(a.paused){
a.play();
}else{
a.pause();
}
}
</script>
</head>
<body>
<video id="ex_1" width="300" height="300" controls="controls">
<source src="gsd.mp4" type="video/mp4">
<source src="gsd.ogg" type="video/ogg">
您的浏览器不支持video标签
</video>
<br/>
<button onclick="clickA()">播放/暂停</button>
</body>
</html>
效果图：（浏览器支持情况下）
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
