您的位置:首页 > 其它

video标签监听播放暂停,隐藏下载按钮

2017-11-23 15:22 513 查看
/* 隐藏视频默认的下载按钮*/

video::-webkit-media-controls-enclosure {overflow:hidden;}

video::-webkit-media-controls-panel {width: calc(100% + 30px);}

/*隐藏音频的默认下载按钮*/

audio::-webkit-media-controls-enclosure {overflow:hidden;}

audio::-webkit-media-controls-panel {width: calc(100% + 30px);}

//播放视频,并且监听视频是否播放结束

init.public.playVideo=function(target){

//点击播放按钮,隐藏遮罩层和自定义的播放按钮
$('#'+target).next('.video-mask').hide();
document.getElementById(target).play();
var md=document.getElementsByClassName("common-video")[0];

//监听播放结束之后显示遮罩层和播放按钮

         md.addEventListener("ended",function(){

        $('#'+target).next('.video-mask').show();

  });

}

//点击视频暂停播放

init.public.pauseVideo=function(target){
document.getElementById(target).pause();
$('#'+target).next('.video-mask').show();

}

//监听视频的播放状态

init.public.judeVidestate=function(){
var myVideo=document.getElementById("_vid");  
myVideo.addEventListener('play',function(){  
$('.video-mask').hide();     
});  
myVideo.addEventListener('pause',function(){  
$('.video-mask').show();     
}); 

}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  视频 video audio