jquery - OwlCarousel 2 .goTo event not working -
hoping owlcarousel 2 experience can help me. have menu @ top , need each menu item go specified slide not working. i'm not getting errors , else within carousel working correctly. can't goto event work. help much appreciated! in advance!
<!doctype html> <html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="assets/owl.carousel.css"> <link rel="stylesheet" href="assets/owl.theme.default.css"> </head> <body> <nav> <ul> <li><a href="" class="hometab">home</a></li> <li><a href="" class="contestinfotab">contest info</a></li> <li><a href="" class="signuptab">sign up</a></li> <li><a href="" class="faqtab">faq</a></li> <li><a href="" class="leaderboardtab">leaderboard</a></li> </ul> </nav> <div class="owl-carousel owl-theme" id="mainnav" style="color:#000;"> <div class="item home"> content slide 1 </div> <div class="item contest"> content slide 2 </div> <div class="item signup"> content slide 3 </div> <div class="item faq"> content slide 4 </div> <div class="item leaderboard"> contentn slide 5 </div> </div> <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> <script src="assets/owl.carousel.js" type='text/javascript'></script> <script src="assets/owl.navigation.js" type='text/javascript'></script> <script> $(document).ready(function () { var carousel = $("#mainnav"); carousel.owlcarousel({ slidespeed : 500, navigation: true, items:1 }); $(".hometab").click(function(e){ e.preventdefault(); carousel.trigger('owl.goto', 0); }); $(".contestinfotab").click(function(e){ e.preventdefault(); carousel.trigger('owl.goto', 1); }); $(".signuptab").click(function(e){ e.preventdefault(); carousel.trigger('owl.goto', 2); }); $(".faqtab").click(function(e){ e.preventdefault(); carousel.trigger('owl.goto', 3); }); $(".leaderboardtab").click(function(e){ e.preventdefault(); carousel.trigger('owl.goto', 4); }); }); </script> </body> </html>
there doesn't seem "goto" event in owl carousel 2 docs.
looks utilize to.owl.carousel instead:
carousel.trigger('to.owl.carousel', [0, 500]); the parameters in square brackets [position, speed].
jquery owl-carousel
No comments:
Post a Comment