一、HTML5新增的video、source标签
<video width="320" height="240" controls="controls“ poster="/images/w3school.gif">
<source src="movie.ogg" type="video/ogg">
<source src="movie.mp4" type="video/mp4">
您的浏览器不支持video标签
</video>
二、HTML5支持的视频格式
三、video标签的属性
四、HTML5的音频标签
<audio src="好久不见.mp3" autoplay controls>
您的浏览器不支持 audio 标签。
</audio>
HTML5支持的音频格式 .wav .mp3
五、音频标签的属性
六、浏览器默认播放控件
<!DOCTYPE HTML>
<html>
<head>
<script>
window.onload=function () {
var playbtn=document.getElementById("play");
var video=document.getElementById("video");
playbtn.onclick=function () {
video.play();
}
}
</script>
</head>
<body>
<video controls=controls loop =loop poster="1.jpg" id="video">
<source src="iceage4.mp4"></source>
<source src="iceage4.webm"></source>
</video>
<input type="button" value="播放" id="play"/>
<audio src="fcml.mp3" controls=controls >
</audio>
</body>
</html>
七、自定义播放控件相关API
video.webkitRequestFullScreen() ： 全屏
video.paused ： 布尔值，是否暂停
video.play() ： 播放
video.pause() ： 暂停
事件：
timeupdate ： 当前播放位置发生改变时产生该事件
video.currentTime ：当前播放的时间，单位秒
video.duration： 返回总时间，单位秒
video.muted: 布尔值，是否静音
video.volume（） : 设置音量
八、Video更多API参考
九、Video的API属性
十、Video的事件
