🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

The jQuery OWL Tube plugin makes use of the popular Owl Carousel 2 plugin to create a responsive, configurable Youtube playlist carousel from a group of Youtube videos you specify.

Carousel Youtube

Documentation

OWL Tube - OWL Carousel Youtube Playlist

Options | default  width:640 height:340 autoplay:1 loop:1 controls: 1 iv_load_policy:3 modestbranding:1 rel:0 showinfo:0 

examle: ...

<link rel="stylesheet" href="../vendors/bootstrap/bootstrap.min.css"> <link rel="stylesheet" href="../vendors/owl-carousel/assets/owl.carousel.min.css"> <link rel="stylesheet" href="../vendors/owl-carousel/assets/owl.theme.default.min.css"> <link rel="stylesheet" href="../vendors/owl-carousel/assets/owl.theme.green.min.css">  <body>     <div class="owl-carousel owl-theme">         <div class="item">                 <iframe type="text/html" width="720" height="405"                 src="https://www.youtube.com/embed/M7lc1UVf-VE?enablejsapi=1"                 frameborder="0" allowfullscreen></iframe>         </div>         <div class="item">                 <iframe type="text/html" width="720" height="405"                 src="https://www.youtube.com/embed/eRiyV1Kan24?enablejsapi=1"                 frameborder="0" allowfullscreen></iframe>         </div>         <div class="item">                 <iframe type="text/html" width="720" height="405"                 src="https://www.youtube.com/embed/9aipBufoJP8?enablejsapi=1"                 frameborder="0" allowfullscreen></iframe>         </div>          <div class="item">                 <iframe type="text/html" width="720" height="405"                 src="https://www.youtube.com/embed/flU42CTF3MQ?enablejsapi=1"                 frameborder="0" allowfullscreen></iframe>         </div>     </div>      ...       <!--vendors-files-->     <script src="../vendors/jquery/jquery-3.3.1.min.js"></script>     <script src="../vendors/bootstrap/popper.min.js"></script>     <script src="../vendors/bootstrap/bootstrap.min.js"></script>     <script src="../vendors/owl-carousel/owl.carousel.min.js"></script>      <!--owl-tube-file-->     <script src="../dist/assets/js/owl-tube.min.js"></script>      <script>      $(document).ready(function(){         var carousel = $('.owl-carousel').owlCarousel({             items:1,             loop:1,             nav:1,             dots:1         });         window.owlTube = $(carousel).owlTube();              });     </script> 

You May Also Like