HTML5视频直播默认静音,HTML5教程 如何实现播放视频中暂停、关闭声音等操作

本篇教程探讨了HTML5教程 如何实现播放视频中暂停、关闭声音等操作,希望阅读本篇文章以后大家有所收获,帮助大家HTML5+CSS3从入门到精通 。

<

html>

HTML5-video(播放暂停视频;打开关闭声音;进度条)

关闭声音

打开声音

播放视频

暂停视频

全屏

进度条:

音量:

var btn=document.getElementsByTagName("button");

var myvideo=document.getElementById("video1");

var pro=document.getElementById("pro");

var ran=document.getElementById("ran");

//关闭声音

function enableMute(){

myvideo.muted=true;

btn[0].disabled=true;

btn[1].disabled=false;

}

//打开声音

function disableMute(){

myvideo.muted=false;

btn[0].disabled=false;

btn[1].disabled=true;

}

//播放视频

function playVid(){

myvideo.play();

setInterval(pro1,1000);

}

//暂停视频

function pauseVid(){

myvideo.pause();

}

//全屏

function showFull(){

myvideo.webkitrequestFullscreen();

}

//进度条展示

function pro1(){

pro.max=myvideo.duration;

pro.value=myvideo.currentTime;

}

//拖动range进行调音量大小

function setvalue(){

myvideo.volume=ran.value/100;

myvideo.muted=false;

}

本文由职坐标整理并发布,希望对同学们有所帮助。了解更多详情请关注职坐标WEB前端HTML5/CSS3频道!

你可能感兴趣的:(HTML5视频直播默认静音)