Muntashir Are Rahi Muntashir Are Rahi - 4 months ago 221
Javascript Question

Jump to specific slide by by clicking link on owl carousel

I have implemented owl carousel in my website. The Carousel Slides are related to the navigation menus. That means when i will click one of the menus the carousel will show that specific slide. I tried it with

to.owl.carousel
but is not working for me. I tried like-

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


where
award
is the menu id and
home
crousel id. 2 is the position of the slide.

My website is http://tonitro.com/test/

How can i trigger this?

Answer

You can use the owl.goTo event to slide your owl carousel to specific slide.

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

Your problem is that you don't have element with id="award" in your html, so $('#award').click will not work.

If you want to trigger the slide when you click on the Award on the top menu you should change your html there to:

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

So $('#award').click will trigger click on that element