怎样用js+html5兑现视频的播放控制

html5 代码：

?

<video?width="640"?height="480"?controls="controls"?id="video"?controls?preload='none'??poster="http://v.zol.com.cn/xxxx.mp4">

js代码：

?

document.addEventListener("DOMContentLoaded", init,?false);

function?init() {

????document._video = document.getElementById("video");

????webm = document.getElementById("webm");

????init_events();

????init_properties();

????setInterval(update_properties, 1000);

}

Function init_events(){

for?(key?in?media_events) {?//监听video的各个属性

????document._video.addEventListener(key, capture,?false);

????}

}

Video?具有的属性：

var?media_properties = [?"error",?"src",?"currentSrc",?"networkState",?"preload",?"buffered",?"readyState",?"seeking",?"currentTime","initialTime",?"duration",?"startOffsetTime",?"paused",?"defaultPlaybackRate",?"playbackRate",?"played",?"seekable",?"ended",?"autoplay",?"loop","controls",?"volume",?"muted"?];

用js控制和获取video的值方法：

设置当前播放的时间：setAttribute(media_properties[currentTime],’123’);

eval("document._video."?+ media_properties[currentTime]);

取视频时长：var?r = eval("document._video."?+ media_properties[duration]);

Alert(r);

控制其他的属性可以用同样的方法。

?

本文转自：http://techbbs.zol.com.cn/1/9_3193.html