video.js 一個(gè)頁(yè)面同時(shí)播放多個(gè)視頻的實(shí)例代碼
具體代碼如下所述:
$(data).each(function(i, item) { // innerHTML += '<li type-id="'+item.id+'">'+ // '<img src="'+(item.imgs?item.imgs:'../../img/videoBg1.jpg')+'" alt="">'+ // '<p>'+item.name+'</p>'+ // '</li>'; innerHTML += '<li type-id="' + item.id + '">' + // '<img src="'+(item.imgs?item.imgs:'../../img/videoBg1.jpg')+'" alt="">'+ '<video style="width:100%;height:100%;" id="example_video_' + item.id + '" class="videoClass video-js vjs-default-skin vjs-big-play-centered" autoplay="autoplay" controls muted><source src="' + item.hls + '" type="application/x-mpegURL">' + '</video>' + '<p>' + item.name + '</p>' + '</li>'; //視頻實(shí)時(shí)播放 setTimeout(function() { var myPlayer = videojs('example_video_' + item.id); videojs('example_video_' + item.id).ready(function() { var myPlayer = this; myPlayer.play(); }); }, 5000); });
引入video.css 和video.js 為前提
調(diào)用主要是
setTimeout(function() { var myPlayer = videojs('example_video_' + item.id); videojs('example_video_' + item.id).ready(function() { var myPlayer = this; myPlayer.play(); }); }, 5000);
需要做個(gè)延時(shí),避免加載失敗
總結(jié)
以上所述是小編給大家介紹的video.js 一個(gè)頁(yè)面同時(shí)播放多個(gè)視頻的實(shí)例代碼,希望對(duì)大家有所幫助,如果大家有任何疑問歡迎給我留言,小編會(huì)及時(shí)回復(fù)大家的!
相關(guān)文章
js中關(guān)于String對(duì)象的replace使用詳解
關(guān)于String對(duì)象的replace使用詳解,需要的朋友可以參考下。2011-05-05JS高級(jí)運(yùn)動(dòng)實(shí)例分析
這篇文章主要介紹了JS高級(jí)運(yùn)動(dòng),結(jié)合實(shí)例形式分析了javascript運(yùn)動(dòng)框架原理、實(shí)現(xiàn)與應(yīng)用技巧,需要的朋友可以參考下2016-12-12關(guān)于RxJS Subject的學(xué)習(xí)筆記
這篇文章主要介紹了關(guān)于RxJS Subject的學(xué)習(xí)筆記,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-12-12Javascript在IE下設(shè)置innerHTML時(shí)出現(xiàn)未知的運(yùn)行時(shí)錯(cuò)誤的解決方法
程序代碼思路大致如下,想動(dòng)態(tài)的改變tr標(biāo)簽的innerHTML內(nèi)容,但是IE卻報(bào)未知的運(yùn)行時(shí)錯(cuò)誤2011-01-01原生JavaScript實(shí)現(xiàn)連連看游戲(附源碼)
原生JavaScript版連連看游戲,有源碼,適合初學(xué)者學(xué)習(xí),喜歡的朋友可以研究下2013-11-11js腳本實(shí)現(xiàn)數(shù)據(jù)去重
最近在一個(gè)項(xiàng)目中,需要去除掉重復(fù)的數(shù)據(jù),之前都是在后臺(tái)實(shí)現(xiàn),現(xiàn)在客戶需求是在前臺(tái)去重,于是就想到了javascript腳本。2014-11-11JavaScript——DOM操作——Window.document對(duì)象詳解
下面小編就為大家?guī)硪黄狫avaScript——DOM操作——Window.document對(duì)象詳解。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-07-07