CODEWITHSUNDEEP
javascripthtmlvideojwplayer
Prabhu Khanna Mahadevan
Prabhu Khanna Mahadevan

Reputation: 943

JW Player stop playing multiple videos

I have multiple video in same page. However – I can play multiple videos at the same time and hear each of the together. When I start another video – the video that is playing have to shut down.

<div class="tab-pane active" id="abc"><div class="panel-body">
    <script src="//content.jwplatform.com/players/abc.js"></script></div>
</div>
 <div class="tab-pane" id="def"><div class="panel-body">
    <script src="//content.jwplatform.com/players/def.js"></script></div>
</div>
<div class="tab-pane" id="ghi"><div class="panel-body">
 <script src="//content.jwplatform.com/players/ghi.js"></script></div>
</div>
<div class="tab-pane" id="jkl"><div class="panel-body">
   <script src="//content.jwplatform.com/players/jkl.js"></script>   </div>
</div>

Upvotes: 1

Views: 1173

Answers (2)

George Syrimis
George Syrimis

Reputation: 41

JW Player has a code example for this:

https://developer.jwplayer.com/jw-player/demos/basic/mutually-exclusive/

Your setup seems off though, you shouldn't have multiple player libraries, so most likely you have multiple single-line embeds which is also not the best thing to do. I'd suggest using code similar to the one described in the document above, you have one cloud hosted player and call 

jwplayer('DIV_ID').setup();

for each player.

Upvotes: 0

simsketch
simsketch

Reputation: 3042

Here is what your HTML might look like:

  <div id='player1'></div>
  <div id='player2'></div>
  <div id='player3'></div>

Here is what your js should be doing. Pay close attention to the onPlay event:

jwplayer("player1").setup({
  playlist: [{
    file: "bbb_sunflower_1080p_60fps_normal.mp4"
    }],
        width: 300,
        aspectratio: '16:9',
        events: {
          onPlay: function() {
            jwplayer('player2').stop();jwplayer('player3').stop();
          },
          onComplete: function() {
            //something can happen at the end of the video here if you'd like.
          }
        },
      });
//etc.

Demo: http://codepen.io/simsketch/pen/LxpmWx

Hope this helps!

Upvotes: 1

Related Questions