分享一個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


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM