The whim of the need to put a 1.5-hour video tutorial on the official website ...
However, loading becomes a problem, the page is cshtml. NET hybrid website, do not know where the restrictions, cause the video can not be added.
No way, only the front-end to find out.
Then cut the video into 4
Load autoplay in turn. The effect is also possible.
Code:
Introduced: <link rel= "stylesheet" href= "//cdn.bootcss.com/video.js/6.0.0-rc.5/alt/video-js-cdn.min.css" >
<script src= "Http://cdn.bootcss.com/video.js/6.0.0-RC.5/alt/video.novtt.min.js" ></script>
Html:
<video id= "my_video_1" class= ' video-js vjs-default-skin vjs-big-play-centered ' controls preload= ' auto ' width= ' 450 ' height= "375" data-setup= ' {} ' autoplay= "AutoPlay" > <source src= ' http://xxxx.com/video/home1.mp4 ' type= ' Video/mp4 ' > </video>
Js:
var vList = [' Http://xxx.com/video/home2.mp4 ', ' http://xxx.com/video/home3.mp4 ', ' http://xxx.com/video/home4.mp4 ', ' Http://xxx.com/video/home1.mp4 ']; Initialize Playlist var vLen = vlist.length;//The length of the playlist var curr = 0;//video currently playing var video = Videojs ("My_video_1", {}, function () { This.on (' ended ', function () { play (); function Play (e) { video.src (Vlist[curr]); Video.load (); Video.play (); curr++; if (Curr >= vLen) { Curr = 0;//play Finished, Replay }}) })
Official Website API Description:
http://docs.videojs.com/
Video.js segment Auto-load video "HTML5 video player"