Question

我正在尝试将“selected”类添加到“url hash button”。

查看原始演示：http://www.owlcarousel.owlgraphic.com/demos/urlhashnav.html

我希望<a class="button secondary url" href="#zero">zero</a>在点击它时更改为<a class="button secondary url selected" href="#zero">zero</a>，或者在其上设置项目自动播放，或者拖动/滑动项目。

我尝试了一个按钮进行测试，但它无法正常工作：

HTML：

 <div id="owl-appt" class="owl-carousel">
        <div class="item one" data-hash="one"><img src="img/gallery/home/appt1/1.jpg" alt=""></div>
        <div class="item two" data-hash="two"><img src="img/gallery/home/appt1/2.jpg" alt=""></div>
        <div class="item three" data-hash="three"><img src="img/gallery/home/appt1/3.jpg" alt=""></div>
</div>


      <a class="url one" href="#one"><img src="img/gallery/home/appt1/s1.jpg" /></a>
      <a class="url two" href="#two"><img src="img/gallery/home/appt1/s2.jpg" /></a>
      <a class="url three" href="#three"><img src="img/gallery/home/appt1/s3.jpg" /></a>

JS：

$("#owl-appt").owlCarousel(
          {
            items : 1,
            autoplay:false,           

            animateOut: 'fadeOut',
            loop:false,
            responsive: true,
            callbacks: true,
            URLhashListener:true,
            startPosition: '#one',

          });
if($("#owl-appt .item.one").parent().is(".active")){
  $("a.url.one").addClass("selected");
}else{
  $("a.url.one").removeClass("selected");
};

Answer 1

我认为如果＃owl-appt .item - active，你需要比较data-hash =“＃one”和href =“＃one”的内容，如果你被分配到“selected”链接。对不起，我不是程序员，只是HTML编码器，但我对这个问题太感兴趣了。

Owl Carousel 2 beta，在Url Hash Navigation上添加“selected”类

1 个答案: