Owl Caraousel2

gistfile1.txt

CSS
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.1/assets/owl.carousel.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.1/assets/owl.theme.default.css" />

JavaScript
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.1/owl.carousel.min.js"></script>

<script type="text/javascript">
  $(document).ready(function() {
              var owl = $('.owl-carousel');
              owl.owlCarousel({
                items: 4,
                loop: true,
                margin: 10,
                autoplay: true,
                autoplayTimeout: 5000,
                // autoplayHoverPause: true
                responsive : {
                  // breakpoint from 0 up
                  0 : {
                      option1 : value,
                      option2 : value,
                      ...
                  },
                  // breakpoint from 480 up
                  480 : {
                      option1 : value,
                      option2 : value,
                      ...
                  },
                  // breakpoint from 768 up
                  768 : {
                      option1 : value,
                      option2 : value,
                      ...
                  }
              }
              });
              $('.play').on('click', function() {
                owl.trigger('play.owl.autoplay', [1000])
              })
              $('.stop').on('click', function() {
                owl.trigger('stop.owl.autoplay')
              })
            })
  </script>
  
HTML

 <div class="owl-carousel owl-theme">
      <img src="http://via.placeholder.com/200x150" alt="">
      <img src="http://via.placeholder.com/200x150" alt="">
      <img src="http://via.placeholder.com/200x150" alt="">
      <img src="http://via.placeholder.com/200x150" alt="">
      <img src="http://via.placeholder.com/200x150" alt="">
      <img src="http://via.placeholder.com/200x150" alt="">
      <img src="http://via.placeholder.com/200x150" alt="">
    </div>