html jquery js 簡易視頻播放器 直接上代碼：html>

Document

#durationbar{

width:?500px;

height:?20px;

}

#durationbar?progress{

width:?100%;

height:?100%;

}

總時長：00:00:00??當前時長：00:00:00

開始

停止

2倍速度

function?test(time_distance){

//?天時分秒換算

/*var?int_day?=?Math.floor(time_distance/86400000)

time_distance?-=?int_day?*?86400000;?*/

var?int_hour?=?Math.floor(time_distance/3600)

time_distance?=?time_distance?-?int_hour?*?3600;

var?int_minute?=?Math.floor(time_distance/60)

time_distance?=?time_distance?-?int_minute?*?60;

var?int_second?=?Math.floor(time_distance)

//?時分秒為單數時、前面加零

/*if(int_day?

int_day?=?"0"?+?int_day;

}?*/

if(int_hour?

int_hour?=?"0"?+?int_hour;

}

if(int_minute?

int_minute?=?"0"?+?int_minute;

}

if(int_second?

int_second?=?"0"?+?int_second;

}

return?int_hour+':'+int_minute+':'+int_second;

}

window.οnlοad=function(){

var?oStart?=?document.getElementById('start');

var?oEnd?=?document.getElementById('end');

var?oPause?=?document.getElementById('pause');

var?oSpeed?=?document.getElementById('speed');

var?oVideo?=?document.getElementById('videoSource');

//?開始函數

oStart.οnclick=function(e){

console.log(oVideo.paused);

if(oVideo.paused==true){

$('#start').text('暫停');

oVideo.play();

}else{

$('#start').text('播放');

oVideo.pause();

}

}

//?暫停函數

/*oPause.οnclick=function(){

oVideo.pause();

}?*/

//?停止函數

oEnd.οnclick=function(){

oVideo.pause();

oVideo.currentTime=0;

}

//?加速函數

oSpeed.οnclick=function(){

oVideo.play();oVideo.playbackRate?=?1.5;//注意這里速度大于4的時候，就沒有聲音了，聲音得不到同步

}

var?aa?=?test(oVideo.duration);

$("#zsc").text(aa);

//oVideo.currentTime=30;

var?i?=?0;

//?這個事件是在視頻播放中一直執行的事件

oVideo.οntimeupdate=function(){

var?oPositionBar?=?document.getElementById('positionBar');

oPositionBar.value=?(oVideo.currentTime/oVideo.duration*100);

console.log('播放時長:'+oVideo.duration);

console.log('播放進度:'+oVideo.currentTime);

var?bb?=?test(parseInt(oVideo.currentTime));

$("#dqsc").text(bb);

/*if(parseInt(oVideo.currentTime)==3?&&?i==0){

oVideo.pause();

i++;

alert("觀看超市");

location.href='http://www.baidu.com';

}*/

}

}

html jquery js 簡易視頻播放器? ?快試試吧！

總結

以上是生活随笔為你收集整理的视频播放页php,html jquery简易视频播放器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。