<!DOCTYPE HTML>
<html
lang="en-US">
<head>
<meta
charset="UTF-8">
<title></title>
<script
type="text/javascript"
src="js/jquery-1.8.3.js"></script>
<script
type="text/javascript">
$(function(){
var video = document.getElementById("video");
alert("duration:"+video.duration+",volume:"+video.volume);
$("#btnPlay").click(function(){
video.volume = 0.5;
video.play();
var time = setInterval(function(){
$("#btnTime").val("剩余时间是:"+Math.ceil(video.duration-video.currentTime)+"
秒");
},1);
var intval = setInterval(function(){
if(video.ended){
clearInterval(intval);
clearInterval(time);
alert("视频播放完毕");
}
},1);
});
$("#btnPause").click(function(){
video.pause();
});
$("#btnMute").click(function(){
video.muted = true;
});
$("#btnCurrentTime").click(function(){
alert("当前播放了:"+video.currentTime+"
秒");
});
});
</script>
<style
type="text/css">
video{cursor:pointer;}
</style>
</head>
<body>
<video src="Moo-O.mp4" id="video" controls>
</video>
<input type="button" value="播放"
id="btnPlay" />
<input type="button" value="暂停"
id="btnPause"/>
<input type="button" value="静音"
id="btnMute"/>
<input type="button" value="播放时间"
id="btnCurrentTime" />
<input type="button"
value="剩余时间" id="btnTime" />
</body>
</html>
原文:http://www.cnblogs.com/liangshanbo/p/3517426.html