分享

简单的封装 原生视频播放器 video 插件

 黄三岁大爱人生 2021-01-18

 通过对官方的 VideoPlayer 视频播放器组件简直封装下方便使用

plus.video.VideoPlayer

开发工具:HBuilder x  支持在线打包实现。

  在有需要的页面引入 videoplus.js 

 html页面

<div id="plusvideo"></div>
  mui.plusReady(function(){

//实例化插件
var video=new VideoPlus("plusvideo",
{
url:"http://onehk-1251146759.cosgz./video_171129.mp4", //支持本地视频和网络视频,格式MP4
img:"https://zs./uploads/image/20171231/1514657764.jpg", //网络视频截图封面
autoplay:false, //是否自动播放视频
isMobile:true, //是否开启当处于移动网络时,提示用户是否继续播放视频。,不支持浏览器环境
isFull:false, //是否点击播放就全屏显示
isFullbutton:true, //是否显示全屏按钮
prompt:function() //当开启isMobile时,这里可以写提示用户的内容,h5+环境才有效
{  
mui.confirm('你当前处于移动手机网络将会消耗手机流量,是否继续播放?', '提示',["取消","确定"], function(e)
{
if(e.index == 1)
{
  video.play();
} 
});  
}


});

 

 需要切换视频播放时

 video.getplayUrl({
url:"http://images./mp4.mp4", //视频链接
img:"https://zs./uploads/image/20171231/1514657764.jpg", //封面截图
});

 附件是 HBuilder x 的工程

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约