$(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>';
//视频实时播放
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 为前提
调用主要是
setTimeout(function() {
var myPlayer = videojs('example_video_' item.id);
videojs('example_video_' item.id).ready(function() {
var myPlayer = this;
myPlayer.play();
});
}, 5000);
需要做个延时,避免加载失败
更多专业前端知识,请上 【猿2048】www.mk2048.com