Uncaught TypeError: $(...).waterwheelCarousel is not a function

ambedkar barre

I am new to jquery i am getting couple of errors with this code can u guys plz identify it n rectify my issue thanks in advance

here is the code. I am trying a waterwheel carousel model but not able to view it

<!Doctype html>
<html>
<head>
<title> this is jquery carousel</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="js/jquery.waterwheelCarousel.min.js"></script>
</head>
<script>
    $(document).ready(function () {
      var carousel = $("#carousel").waterwheelCarousel({
        flankingItems: 3,
      });

      $('#prev').bind('click', function () {
        carousel.prev();
        return false
      });

      $('#next').bind('click', function () {
        carousel.next();
        return false;
      });
    });
</script>
<body>


   <div id="carousel">
        <img src="images/1.jpg" id="item-1"/>
        <img src="images/2.jpg" id="item-2"/>
        <img src="images/3.jpg" id="item-3"/>
        <img src="images/4.jpg" id="item-4"/>
        <img src="images/5.jpg" id="item-5"/>
        <img src="images/6.jpg" id="item-6"/>
    </div>
    <a href="#" id="prev">Prev</a>
    <a href="#" id="next">Next</a>

</body>
</html>

Anant Singh---Alive to Die

1.Make sure jQuery higher version is there.

2.Make sure that jquery.waterwheelCarousel.min.js path is correct (otherwise file will not be inculded and code will not work)

Working example:-

$(document).ready(function () {
  var carousel = $("#carousel").waterwheelCarousel({
    flankingItems: 3,
  });

  $('#prev').bind('click', function () {
    carousel.prev();
    return false
  });

  $('#next').bind('click', function () {
    carousel.next();
    return false;
  });
});

<!Doctype html>
<html>
<head>
<title> this is jquery carousel</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.jqueryscript.net/demo/jQuery-Waterwheel-Carousel-Plugin/js/jquery.waterwheelCarousel.min.js"></script>
</head>
<body>
  <div id="carousel">
    <img src="https://www.jqueryscript.net/demo/jQuery-Waterwheel-Carousel-Plugin/images/1.jpg" id="item-1"/>
    <img src="https://www.jqueryscript.net/demo/jQuery-Waterwheel-Carousel-Plugin/images/2.jpg" id="item-2"/>
    <img src="https://www.jqueryscript.net/demo/jQuery-Waterwheel-Carousel-Plugin/images/3.jpg" id="item-3"/>
    <img src="https://www.jqueryscript.net/demo/jQuery-Waterwheel-Carousel-Plugin/images/4.jpg" id="item-4"/>
    <img src="https://www.jqueryscript.net/demo/jQuery-Waterwheel-Carousel-Plugin/images/5.jpg" id="item-5"/>
    <img src="https://www.jqueryscript.net/demo/jQuery-Waterwheel-Carousel-Plugin/images/6.jpg" id="item-6"/>
  </div>
  <a href="#" id="prev">Prev</a>
  <a href="#" id="next">Next</a>

</body>
</html>

Collected from the Internet

Please contact [email protected] to delete if infringement.