owl 轮播跳转到特定的幻灯片并添加 class

Question

我使用 Owl Carousel 创建了一个基于幻灯片的帖子页面。我对它实现了数据哈希，除了我需要一个函数将 class 添加到当前哈希项之外，它工作得很好，所以当更改哈希位置或接收外部哈希时-link，这个项目到添加一个class。

这是我的代码，我使用 Owl Carousel v2.3.4，网站在 wordpress 中：

$('#post_top_slider').owlCarousel({
  loop: false,
  margin: 0,
  nav: true,
  dots: false,
  URLhashListener: true,
  startPosition: 'URLHash',
  addClassActive: true,
  autoplayHoverPause: true,
  responsive: {
    0: {
      items: 1
    },
    600: {
      items: 2
    },
    1000: {
      items: 3
    }
  }
});

$('#post_top_slider .owl-stage .owl-item').first().addClass('ps_actve');

$('#post_top_slider .owl-stage .owl-item').click(function(event) {
  $(this).siblings('.owl-item').removeClass('ps_actve');
  $(this).addClass('ps_actve');
  var tab_id = $(this).children('.pts_item').attr('data-id');
  //alert(tab_id);
  $(tab_id).siblings('.ptsd_item').hide();
  $(tab_id).show();
});

我需要添加到哈希项的class是"ps_actve"。网站是 here。

Answer 1

问题解决了。我只是将代码放在第 3307 行的 owlcarousel.js 中：

current.siblings('.owl-item').removeClass('ps_actve');
current.addClass('ps_actve');
var tab_id = current.children('.pts_item').attr('data-id');
//alert(tab_id);
$(tab_id).siblings('.ptsd_item').hide();
$(tab_id).show();

owl 轮播跳转到特定的幻灯片并添加 class

owl carousel jump to specific slide and add class to it

jquery

owl-carousel