通过单击猫头鹰轮播上的链接跳转到特定的幻灯片

Question

我已经在网站上实现了猫头鹰轮播。 轮播幻灯片与导航菜单相关。 这意味着当我单击菜单之一时，轮播将显示该特定幻灯片。 我尝试了to.owl.carousel但对我不起作用。 我尝试过-

$('#award').click(function(){
    $('#home').trigger('to.owl.carousel', 2)
});

其中award是菜单ID和home容器ID。 2是幻灯片的位置。

我的网站是http://tonitro.com/test/

我该如何触发呢？

Answer 1

您可以使用owl.goTo事件将您的猫头鹰轮播滑动到特定幻灯片。

$('#home').trigger('owl.goTo', 2)

您的问题是您的html中没有带有id="award"元素，因此$('#award').click无法正常工作。

如果要在单击顶部菜单上的Award时触发幻灯片，则应将html更改为：

<li><a href="#portfolio" id="award">Awards</a></li>

因此$('#award').click将触发对该元素的点击