页面上的自动倒带实时视频流负载

发布于 2025-02-13 15:20:36 字数 2742 浏览 1 评论 0原文

我目前为我的4个JWplayers设置了以下代码。它将在按钮点击时倒带所有4个播放器60秒。这很棒。

我将如何在页面加载中对其进行编辑60秒自动倒带，以便当视频启动DVR并自动寻求-60秒，并且不需要按下按钮。它只是在60秒的延迟下自动加载。

我尝试过，但没有运气。解决代码以实现这一目标的任何帮助将是很棒的！

<input type="button" value="Pause" onClick="jwplayer('video1').pause(true);jwplayer('video2').pause(true);;jwplayer('video3').pause(true);;jwplayer('video4').pause(true);;" style="background:rgba(192,192,192,0.3);color:white;font-weight:bold" name="button2">

jwplayer("video4").onBeforePlay(function() {
  var position = jwplayer('video1').getPosition();
  position -= 60;
  jwplayer('video1').seek(position);;
  
  var position = jwplayer('video3').getPosition();
  position -= 60;
  jwplayer('video3').seek(position);;
  
  var position = jwplayer('video4').getPosition();
  position -= 60;
  jwplayer('video4').seek(position);;
  
  var position = jwplayer('video2').getPosition();
  position -= 60;
  jwplayer('video2').seek(position);;
});

玩家代码

<script type="text/javascript" src="jwplayer.js"></script>
                <script type="text/javascript">jwplayer.key="3SYLbRo6MN5cBDxwpZh3dl1gb0lMTUOos31M5hoAlf4=";</script>
</div>
<script type="text/javascript">
                // jwplayer.key="sXW0XA1MksiJ6hYVNHKJFCtOB4qTihu2B0xyTyZoMiA=";
                jwplayer.key = 'sXW0XA1MksiJ6hYVNHKJFCtOB4qTihu2B0xyTyZoMiA=';</script>
</head>
<body>
  <div id="wrapvideo">
    <div id='video1'></div> 
  </div>
    </body>
</html>
<script src='//static.codepen.io/assets/common/stopExecutionOnTimeout-de7e2ef6bfefd24b79a3f68b414b87b8db5b08439cac3f1012092b2290c719cd.js'></script>
<script >var playerInstance = jwplayer("video1");
playerInstance.setup({ skin: {
          "name": "alaska",
          "url": ""
        },
logo: {
          "file": "",
          "position": "top-right",
          "hide": "false",
        },
         
                    'file': "DVR m3u8 here",
                    'title': '',
                    'aspectratio': '16:9',
                    stretching: 'exactfit',
                    'bufferlength': '5',
                    'height': '126px',
                    'width': '624px',
                    'primary': 'hls',
                    'sharing':'false',
                    'controls':'false',
                    'autostart': 'true',
                    'wmode': 'opaque',
                    'image': '',
                    'abouttext': '',
                    'aboutlink': ''
                });



 
</script>
</div

原文

I have the following code for my 4 jwPlayers set in place currently. It will rewind ALL 4 players 60 seconds on button click. This works great.

How would I edit this to auto rewind 60 seconds on page load so that when the video starts the DVR and auto seeks -60 seconds and no button is needed to be pressed. It just automatically loads on a 60 sec delay.

I tried this but no luck. Any help with fixing the code to achieve this would be great!

<input type="button" value="Pause" onClick="jwplayer('video1').pause(true);jwplayer('video2').pause(true);;jwplayer('video3').pause(true);;jwplayer('video4').pause(true);;" style="background:rgba(192,192,192,0.3);color:white;font-weight:bold" name="button2">

jwplayer("video4").onBeforePlay(function() {
  var position = jwplayer('video1').getPosition();
  position -= 60;
  jwplayer('video1').seek(position);;
  
  var position = jwplayer('video3').getPosition();
  position -= 60;
  jwplayer('video3').seek(position);;
  
  var position = jwplayer('video4').getPosition();
  position -= 60;
  jwplayer('video4').seek(position);;
  
  var position = jwplayer('video2').getPosition();
  position -= 60;
  jwplayer('video2').seek(position);;
});

Player code

<script type="text/javascript" src="jwplayer.js"></script>
                <script type="text/javascript">jwplayer.key="3SYLbRo6MN5cBDxwpZh3dl1gb0lMTUOos31M5hoAlf4=";</script>
</div>
<script type="text/javascript">
                // jwplayer.key="sXW0XA1MksiJ6hYVNHKJFCtOB4qTihu2B0xyTyZoMiA=";
                jwplayer.key = 'sXW0XA1MksiJ6hYVNHKJFCtOB4qTihu2B0xyTyZoMiA=';</script>
</head>
<body>
  <div id="wrapvideo">
    <div id='video1'></div> 
  </div>
    </body>
</html>
<script src='//static.codepen.io/assets/common/stopExecutionOnTimeout-de7e2ef6bfefd24b79a3f68b414b87b8db5b08439cac3f1012092b2290c719cd.js'></script>
<script >var playerInstance = jwplayer("video1");
playerInstance.setup({ skin: {
          "name": "alaska",
          "url": ""
        },
logo: {
          "file": "",
          "position": "top-right",
          "hide": "false",
        },
         
                    'file': "DVR m3u8 here",
                    'title': '',
                    'aspectratio': '16:9',
                    stretching: 'exactfit',
                    'bufferlength': '5',
                    'height': '126px',
                    'width': '624px',
                    'primary': 'hls',
                    'sharing':'false',
                    'controls':'false',
                    'autostart': 'true',
                    'wmode': 'opaque',
                    'image': '',
                    'abouttext': '',
                    'aboutlink': ''
                });



 
</script>
</div

分享到QQ

分享到微博