how to make a jquery carousel

Question

jquery

  $('img').click(function() {
    $('#carousel-container').toggle();
    var img = $(this).attr('src');
    var left = $(this).prev().attr('src');
    var right = $(this).next().attr('src');
    $("#carousel").attr('src', img);

    $('#carousel-right').click(function() {
      $('#carousel').attr('src', right);
    });

    $('#carousel-left').click(function() {
      $('#carousel').attr('src', left);
    });
  });

html

img(src='images/img1.jpg')
img(src='images/img2.jpg')
img(src='images/img3.jpg')
img(src='images/img4.jpg')
img(src='images/img5.jpg')
img(src='images/img6.jpg')
img(src='images/img7.jpg')
img(src='images/img8.jpg')
img(src='images/img9.jpg')
img(src='images/img10.jpg')
img(src='images/img11.jpg')
img(src='images/img12.jpg')
img(src='images/img13.jpg')
img(src='images/img14.jpg')
img(src='images/img15.jpg')
img(src='images/img16.jpg')

I want a carousel to pop up when a image is clicked showing the clicked image. and then have left and right buttons to cycle through the images. But i don't know how to cycle through the images.

Answer 1

You can use Bootstrap carousel it's really easy to use it.