Owl Carousel no se reproducirá automáticamente
Estoy construyendo un sitio de WordPress con un carrusel JQuery usando elBúho Carrusel 2 Complemento JQuery. He usado este carrusel antes con éxito, pero estoy perplejo con este y necesito tu ayuda. Espero que otros que puedan tener el mismo problema puedan hacer referencia a esta solución con la que todos ayudan.
El carrusel se cargará, las imágenes se mostrarán y la mayoría de las opciones que he probado funcionan, pero la reproducción automática no cargará la siguiente imagen después de 5 segundos. Todos los archivos están en su lugar correcto y se cargan correctamente, como se verifica utilizando el inspector de red Firebug.Gracias de antemano por su ayuda / sugerencias!
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>
También he intentado agregarowl.trigger('owl.play',6000);
dentro de la función document.ready según una sugerencia sobreeste hilo de stackoverflow en vano.