javascript - 如何制作jquery轮播

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')

我希望在单击图像时弹出一个轮播，显示单击的图像。然后使用左右按钮循环浏览图像。但我不知道如何循环浏览图像。

Answer 1

您可以使用Bootstrap carousel使用它真的很容易。