当前位置: 移动技术网 > IT编程>开发语言>JavaScript > videojs

videojs

2018年10月24日  | 移动技术网IT编程  | 我要评论

莆田seo,英菲尼迪品牌介绍,vsnpstd3.exe

 1     <link href="http://vjs.zencdn.net/5.5.3/video-js.css" rel="stylesheet">
 2     <script src="http://vjs.zencdn.net/5.5.3/video.js"></script>
 3     <!-- if you'd like to support ie8 -->
 4     <script src="http://vjs.zencdn.net/ie8/1.1.1/videojs-ie8.min.js"></script>
 5 
 6     <video id="roomvideo" class="video-js" controls preload="auto" width="100%" height="100%" class="vjs-big-play-centered">
 7         <source src="${rtmpurl }" type="rtmp/flv">
 8         <p class="vjs-no-js">播放视频需要启用 javascript,推荐使用支持html5的浏览器访问。</p>
 9     </video>
10 
11     <script type="text/javascript">
12         document.getelementbyid("roomvideo").style.height= window.innerheight +"px";
13         document.getelementbyid("roomvideo").style.width= window.innerwidth +"px";
14 
15         var options = {
16             techorder : ["html5","flash"],
17             //autoplay:true, //是否自动播放
18             bigplaybutton:false, //是否显示播放按钮
19             controls:true, //是否用显示控制条
20             texttrackdisplay:false,
21             posterimage:false,
22             errordisplay:false,
23             control:{
24                 captionsbutton:false,
25                 chaptersbutton:false,
26                 subtitlesbutton:false,
27                 livedisplay:false,
28                 playbackratemenubutton:false
29             },
30             controlbar: {
31                 mutetoggle:false,
32                 progresscontrol:false
33             }
34         };
35         var player = videojs('roomvideo', options, function onplayerready() {
36             videojs.log('播放器已经准备好了!');
37             player.play();
38             startvideo();
39 
40             this.on('ended', function() {
41                 console.log('播放结束了!');
42             });
43 
44         });
45 
46         var isvideobreak;
47         function startvideo() {
48             //判断开始播放视频,移除高斯模糊等待层
49             /*var isvideoplaying = setinterval(function(){
50                 var currenttime = player.currenttime();
51                 if(currenttime > 0){
52                     $('.vjs-poster').remove();
53                     clearinterval(isvideoplaying);
54                 }
55             },200)*/
56 
57             //判断视频是否卡住,卡主3s重新load视频
58             var lasttime = -1,
59                 trytimes = 0;
60 
61             clearinterval(isvideobreak);
62             isvideobreak = setinterval(function(){
63                 var currenttime = player.currenttime();
64                 if(currenttime == lasttime){
65                     //此时视频已卡主3s
66                     //设置当前播放时间为超时时间,此时videojs会在play()后把currenttime设置为0
67                     player.currenttime(currenttime+10000);
68                     player.play();
69 
70                     //尝试5次播放后,如仍未播放成功提示刷新
71                     if(++trytimes > 5){
72                         //dialog('提示',"您的网速有点慢,刷新下试试",1);
73                         window.location.reload();
74                         trytimes = 0;
75                     }
76                 }else{
77                     lasttime = currenttime;
78                     trytimes = 0;
79                 }
80             },3000)
81         }
82 
83     </script>
84 
85     ${hlsurl } <br/>
86     ${rtmpurl } <br/>
87     ${hdlurl } <br/>

 

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网