Wednesday, December 24, 2025

How to Play two videos with videos.js

 <html>

<head>

  <link href="https://vjs.zencdn.net/8.23.4/video-js.css" rel="stylesheet" />


  <!-- If you'd like to support IE8 (for Video.js versions prior to v7) -->

   <script src="https://vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js">

   

    function init() {

        var url = "https://dash.akamaized.net/akamai/test/caption_test/ElephantsDream/elephants_dream_480p_heaac5_1_https.mpd",

            video = video = document.querySelector('video'),

            player;


        player = dashjs.MediaPlayer({}).create();

        player.initialize(video, url, true);

    }

</script>

</head>


<body>

<video

    id="my-player"

    class="video-js"

    controls

    preload="auto"

    poster="//vjs.zencdn.net/v/oceans.png"

    data-setup='{}'>

  <source src="//vjs.zencdn.net/v/oceans.mp4" type="video/mp4"></source>

  <source src="//vjs.zencdn.net/v/oceans.webm" type="video/webm"></source>

  <source src="//vjs.zencdn.net/v/oceans.ogv" type="video/ogg"></source>

  <p class="vjs-no-js">

    To view this video please enable JavaScript, and consider upgrading to a

    web browser that

    <a href="https://videojs.com/html5-video-support/" target="_blank">

      supports HTML5 video

    </a>

  </p>

</video>

  

   <video

      id="my-video"

      class="video-js vjs-default-skin"

      controls

      preload="auto"

      width="560"

      height="300"

      data-setup='{}'>

   

      <source

         src="https://vjs.zencdn.net/v/oceans.mp4"

         type="video/mp4"

         size="1080"

      >

      <track

         kind="subtitles"

         src="https://gist.githubusercontent.com/samdutton/ca37f3adaf4e23679957b8083e061177/raw/e19399fbccbc069a2af4266e5120ae6bad62699a/sample.vtt"

         srclang="en"

         label="English"

         

      >

   </video>

  </body>

  <html>

  

  

  




No comments:

Post a Comment