java web播放器实现点击进度条播放_HTML5实现video标签的自定义播放进度条

//为了不随意的创建全局变量，我们将我们的代码放在一个自己调用自己的匿名函数中，这是一个好的编程习惯

(function(window, document){//获取要操作的元素

var video = document.getElementById("video");var videoControls = document.getElementById("videoControls");var videoContainer = document.getElementById("videoContainer");var controls = document.getElementById("video_controls");var playBtn = document.getElementById("playBtn");var fullScreenBtn = document.getElementById("fullScreenBtn");var progressWrap = document.getElementById("progressWrap");var playProgress = document.getElementById("playProgress");var fullScreenFlag = false;varprogressFlag;//创建我们的操作对象，我们的所有操作都在这个对象上。

var videoPlayer ={

init:function(){var that = this;

video.removeAttribute("controls");

bindEvent(video,"loadeddata", videoPlayer.initControls);