Html5中Video标签的基本使用
<!DOCTYPE html><html>
<head>
<title>HTML5视频标签</title>
<script>
// 获取标签
var video1 = null;
window.onload = function(){
video1 = document.getElementById("video1");
}
// 如果暂停则播放，否则暂停
function playPause(){
if(video1.paused){
video1.play();
}else{
video1.pause();
}
}
// 修改宽度
function makeBig(){
video1.style.width="400px";
}
function makeNormal(){
video1.style.width="200px";
}
function makeSmall(){
video1.style.width="100px";
}
</script>
</head>
<body>
<!-- controls：显示控制进度条 autoplay：自动播放 loop：循环播放 muted：静音播放 poster：预览图-->
<video id="video1" width="300" height="200" controls muted poster="http://www.yusian.com/download/sian.png">
<source src="http://w3cschool.cn/movie.ogg" type="video/ogg">
您的浏览器不支持HTML5视频播放
</video>
<div style="margin-top: 10px;width: 200px;text-align: center">
<button>播放/暂停</button>
<button>大</button>
<button>中</button>
<button>小</button>
</div>
</body>
</html>
页:
[1]