jquery - 第二个猫头鹰轮播照片滑块不起作用

Question

我已经忙了一段时间了，在这里问了很多问题。
但这是整个代码，它是关于第二个轮播不起作用的，第一个很好用。

谢谢。

http://pastebin.com/wtPgi4cV

Answer 1

要同时使用更多的owl-carousel，只需使用不同的“id”

javascript

$(document).ready(function() {

  $("#owl-demo1").owlCarousel();
  $("#owl-demo2").owlCarousel();

});

html

<div id="owl-demo1" class="owl-carousel">
    <div class="item"><img src="slide1.jpg"></div>
    <div class="item"><img src="slide2.jpg"></div>
    <div class="item"><img src="slide3.jpg"></div>
    <div class="item"><img src="slide4.jpg"></div>
    <div class="item"><img src="slide5.jpg"></div>
    <div class="item"><img src="slide6.jpg"></div>
</div>

<div id="owl-demo2" class="owl-carousel">
    <div class="item"><img src="slide7.jpg"></div>
    <div class="item"><img src="slide8.jpg"></div>
    <div class="item"><img src="slide9.jpg"></div>
    <div class="item"><img src="slide10.jpg"></div>
    <div class="item"><img src="slide11.jpg"></div>
    <div class="item"><img src="slide12.jpg"></div>
</div>

Answer 2

HTML

<div class="crousel-set">
    <div class="item"><img src="slide1.jpg"></div>
    <div class="item"><img src="slide2.jpg"></div>
    <div class="item"><img src="slide3.jpg"></div>
    <div class="item"><img src="slide4.jpg"></div>
    <div class="item"><img src="slide5.jpg"></div>
    <div class="item"><img src="slide6.jpg"></div>
</div>

<div class="crousel-set">
    <div class="item"><img src="slide7.jpg"></div>
    <div class="item"><img src="slide8.jpg"></div>
    <div class="item"><img src="slide9.jpg"></div>
    <div class="item"><img src="slide10.jpg"></div>
    <div class="item"><img src="slide11.jpg"></div>
    <div class="item"><img src="slide12.jpg"></div>
</div>

JavaScript

$(document).ready(function() {
    $(".crousel-set").each(function(index, crousel) {
        crousel.owlCarousel();
    });
});