zoukankan      html  css  js  c++  java
  • 分享一个Html5+video 基于mui 5+的视频播放器

    https://ask.dcloud.net.cn/article/12949

    1. android, 要开启硬件加速,manifest.json文件加 "hardwareAccelerated":true
      复制代码
      "google": {       
         "hardwareAccelerated":true  
               }  

    或者创建文件时加
    // true表示开启Webview的硬件加速,false表示关闭Webview的硬件加速
    var webview = plus.webview.create( "url", "id",{hardwareAccelerated:true});
    webview.show();

    2. IOS iphone, 加 "allowsInlineMediaPlayback": true 禁止视频自动弹出播放,去掉原生播放控件
    ```javascript  
    
    "plus":{  
        "allowsInlineMediaPlayback": true  
    }  
    

    3.调用

    复制代码//#video_Container 是视频区域DIV的ID  
    
           //初始化插件  
    var htmlvideo=Html5video("#video_Container",  
    {  
     title:"新坦结衣Gakki雪肌精广告", //视频标题,当全屏时会显示  
     url:"2017123101.mp4", //支持本地视频和网络视频,格式MP4  
     img:"img/002.jpg", //视频截图封面  
     time:"02:30", //视频总时间以分钟单位,当网络缓慢时,没办法及时加载出来,如已知可以填写,可不填。  
     autoplay:false, //是否自动播放视频  
     isMobile:false, //是否开启当处于移动网络时,提示用户是否继续播放视频。,不支持浏览器环境  
     isFull:true, //是否点击播放就全屏显示  
     iospay:false, //如果是IOS系统是否采用苹果系统自带播放器, 可以在浏览器或微信中,全屏观看视频  
     drag:true, //禁止拖动,调节,音量和亮度  
     isfull:true, //是否显示全屏按钮  
     prompt:function(video) //当开启isMobile时,这里可以写提示用户的内容,h5+环境才有效  
     {    
                   mui.confirm('你当前处于移动手机网络将会消耗手机流量,是否继续播放?', '提示',["取消","确定"], function(e)  
                   {  
                        if(e.index == 1)  
                        {  
                          video.play();   
                        }   
                  },"div");         
     }  
    });   
    

    新增了,同一页面,可以切换视频播放

    复制代码mui("body").on("tap","#openvideo",function()  
    {  
    //切换视频播放  
    htmlvideo.getplayUrl({url:"  ",img:"  ",title:" "});  
    });

    html5video_dome_20180913.zip
  • 相关阅读:
    算法-最大公约数
    算法-最大连续子序列和
    iOS开发-Bug锦囊
    iOS开发-简单抽奖
    iOS开发-UIActionSheet简单介绍
    iOS开发-UIActivityIndicatorView简单使用
    iOS开发-UITextView实现PlaceHolder的方式
    iOS开发-Reachability实时检测Wifi,2G/3G/4G/网络状态
    [转]jsPlumb插件做一个模仿viso的可拖拉流程图
    Python 日期和时间
  • 原文地址:https://www.cnblogs.com/honeynm/p/12778045.html
Copyright © 2011-2022 走看看