HTML5视频播放器自定义样式控制播放代码示例

HTML5视频播放器自定义样式控制播放代码示例

  
<div id="video_div" style="text-align:center;">  
<button onclick="playPause()">播放/暂停</button>  
<button onclick="toBig()">大</button>  
<button onclick="toNormal()">中</button>  
<button onclick="toSmall()">小</button>  
<video id="myVideo" width="500" height="250" style="margin-top:15px;">  
<source src="demo.mp4" type="video/mp4" />  
<source src="demo.ogg" type="video/ogg" />  
您的浏览器不支持此HTML5 视频标签。  
</video>  
</div>  

<script type="text/javascript">  
var myVideo=document.getElementById("myVideo");  
function playPause()  
{  
if (myVideo.paused)  
myVideo.play();  
else  
myVideo.pause();  
}  
function toBig()  
{  
myVideo.width=560;  
}  
function toNormal()  
{  
myVideo.width=420;  
}  
function toSmall()  
{  
myVideo.width=320;  
}  
</script>