Esto tengo en function.php de mi template
Código PHP:
function mi_inicio() {
if (!is_admin()) {
// comment out the next two lines to load the local copy of jQuery
wp_deregister_script('jquery');
wp_enqueue_script('jquery');
}
}
add_action('init', 'mi_inicio');
Código HTML:
$(document).ready(function(){ var slides, timer; slides = $('#slider .slidesContainer > .slide'); function sliderScroll(direction){ position = $('#slider').scrollLeft(); totalWidth = (slides.length * slides[0].offsetWidth) - slides[0].offsetWidth switch (direction) { case 'right': //Derecha if (position+slides[0].offsetWidth > totalWidth){ //Si la siguiente posición se sale del contenedor, vuelve al principio. $('#slider:not(:animated)').animate({scrollLeft:0},1000); } else { //Si no es el final, suma a la posición actual la anchura del slide. $('#slider:not(:animated)').animate({scrollLeft:position+slides[0].offsetWidth},1000); } break; case 'left': //Izquierda if (position-slides[0].offsetWidth < 0){ //Si la siguiente posición se sale del contenedor, vuelve al final. $('#slider:not(:animated)').animate({scrollLeft:totalWidth},1000); } else { //Si no es el final, resta a la posición actual la anchura del slide. $('#slider:not(:animated)').animate({scrollLeft:position-slides[0].offsetWidth},1000); } break; } } function initTimer(){ timer = setInterval(function(){sliderScroll('right');}, 5000); } $('#slider .slidesContainer').css('width',slides[0].offsetWidth * slides.length); $('.next').click(function(){ clearInterval(timer); //Desactiva el temporizador sliderScroll('right'); //Mueve el scroll a la derecha initTimer(); //Vuelve a activar el temporizador return false; }); //Click en el botón "prev" $('.prev').click(function(){ clearInterval(timer); //Desactiva el temporizador sliderScroll('left'); //Mueve el scroll a la izquierda initTimer(); //Vuelve a activar el temporizador return false; }); initTimer(); });
Gracias