Tuesday, 15 March 2011

javascript - Owl Carousel Will Not Autoplay -



javascript - Owl Carousel Will Not Autoplay -

i'm building wordpress site jquery carousel using owl carousel 2 jquery plugin. i've used carousel before success, i'm stumped on 1 , need help. i'm hoping others may run same issue can reference solution help with.

the carousel load, images displaying, , options i've tried working, autoplay not load next image after 5 seconds. files in proper place , loading correctly, verified using firebug network inspector. thank help/suggestions in advance!

customjs.js:

$(document).ready(function(){ var owl = $(".owl-carousel"); owl.owlcarousel({ items: 1, autoplay: true, autoplaytimeout: 5000, autoplayhoverpause: true }); });

html:

<head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script> <script src="owl/js/owl.carousel.min.js"></script> <script type="text/javascript" src="customjs.js"></script> </head> <body> <div id="feature" class="full"> <!-- feature rotator --> <div id="home-feature" class="owl-carousel owl-theme"> <div class="item"> <a href="#"> <img src="/images/home/rotator1.jpg" alt="feature 1"/> </a> </div> <div class="item"> <a href="#"> <img src="/images/home/rotator2.jpg" alt="feature 2"/> </a> </div> <div class="item"> <a href="#"> <img src="/images/home/rotator3.jpg" alt="feature 3"/> </a> </div> <div class="item"> <a href="#"> <img src="/images/home/rotator4.jpg" alt="feature 4"/> </a> </div> </div> </div> </body>

i have tried appending owl.trigger('owl.play',6000); within document.ready function per suggestion on this stackoverflow thread no avail.

figured out. wow, can't believe missed that. had include autoplay.js in section

<script src="owl/js/owl.autoplay.js"></script>

javascript jquery wordpress carousel owl-carousel

No comments:

Post a Comment