Carousel bootstrap 3 Swipe does not work

Question

I’m trying to make a Swipe on bootstrap 3 Carousel but I’m not getting it.

Html Code

  <div id="myCarousel" class="carousel slide">
      <ol class="carousel-indicators">
          <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
          <li data-target="#myCarousel" data-slide-to="1"></li>
          <li data-target="#myCarousel" data-slide-to="2"></li>
          <li data-target="#myCarousel" data-slide-to="3"></li>
      </ol>

      <div class="carousel-inner">
          <div class="item active">
              <div class="fill back1"></div>
          </div>
          <div class="item">
              <div class="fill back2"></div>
          </div>
          <div class="item">
              <div class="fill back3"></div>
          </div>
          <div class="item">
              <div class="fill back4"></div>
          </div>
      </div>
  </div>

JS Code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="js/jquery.mobile-1.4.5.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script>
    $('.carousel').carousel({
        interval: 5000 //changes the speed
    });
    $(function () { 
       $("#myCarousel").swiperight(function() {  
          $(this).carousel('prev');  
          });  
       $("#myCarousel").swipeleft(function() {  
          $(this).carousel('next');  
     });  
    }); 
</script>