CODEWITHSUNDEEP
videostreamingplyrhls.js
MichaGue
MichaGue

Reputation: 61

How to configure multiple video instances using hls.js and plyr

I am using plyr (https://github.com/sampotts/plyr) and hls.js (https://github.com/video-dev/hls.js/) for streaming video. The example https://codepen.io/pen?template=oyLKQb works for one video instance. At the moment the document.querySelector only detects the first instance. How can a I adapt the code to have more than one video instances on the same page?

I have tried to work with ids inside each instance, e.g. <video id=player1"></video>. and called document.querySelector('player1.video'), but this did not work.

Upvotes: 1

Views: 3802

Answers (1)

MichaGue
MichaGue

Reputation: 61

I have found a solution for my problem using document.querySelectorAll('video'). If you are interested, you find a codepen here https://codepen.io/MichaGue/pen/oRWVdq

Upvotes: 1

Related Questions