1

Estoy trabajando con un carousel para wordpress, de un plugin que encontré en el repositorio, y funciona muy bien. El problema que no tiene la función de autoplay, o sea que hay que darle siguiente o anterior de manera manual, pero yo necesito que sea automático y la verdad que no se mucho javascript. Claro que he probado otros plugins pero por distintas razones este es el que me convenció más, aunque lamentablemente no brinda soporte. Por lo que entiendo, hay que modificar la siguiente función o escribir una pero relacionada con esta. Creo que es algo sencillo de hacer porque he revisado varios códigos pero no se bien cómo hacerlo. Ojalá alguien pudiera orientarme. No pongo el nombre del plugin, pero si quieren lo pongo. El archivo js es corto pero sólo pongo este fragmento

/*Next, Prev click*/
jQuery(document).on( 'click', '#post-cs .ps-prev, #post-cs .ps-next, #post-cs .ps-pagi a', function() {
    var get_paged = jQuery(this).attr('data-paged');
    var get_id = jQuery(this).closest('#post-cs').attr('data-id');
    if(jQuery(this).hasClass('ps-prev')) {
        if(!get_paged) {
            get_paged = jQuery(this).attr('data-total');
        }
    }
    /*Get slider data*/
    postcs_getdata(get_paged, get_id);
});
2
  • ¿Podrías proporcionarnos el nombre y/o enlace al carrusel de imágenes que estás usando? Eso nos ayudaría, al menos, a leer su documentación o ver su código fuente para proporcionarte la mejor forma de hacer lo que necesitas. el 15 sep. 2021 a las 6:36
  • El plugin se llama Post Carousel & Slider. Lo mejor de él son las consultas que permite para seleccionar los posts que se meten al carrusel, que en otros plugins son opciones de paga. Es muy fácil de usar y modificar, y ligero, pero en cuanto a js se me dificulta. No tiene documentación. wordpress.org/plugins/post-types-carousel-slider
    – Oox
    el 15 sep. 2021 a las 13:16

3 respuestas 3

1

Puedes disparar el evento en el botón que desees mediante un setInterval. No es una solución muy elegante, pero sin entrar en el código del plugin puede funcionar.

setInterval(()=>$("#post-cs.ps-next" ).trigger( "click"), 1000);

Esto hace que cada 1000ms se dispare el click en el botón id="post-cs" con class=".ps-next", que parece ser el que hace avanzar el carousel. Repito que lo suyo sería ver el plugin y modificarlo para ponerle la opción de automático de alguna manera.

2
  • me parece buena idea. voy a probarla, aunque tengo la duda si tu código lo pongo dentro de un jquery(document) o una función, como vi en otros ejemplos. gracias
    – Oox
    el 15 sep. 2021 a las 13:19
  • Funcionó bastante bien la idea. Gracias!
    – Oox
    el 15 sep. 2021 a las 18:59
0

Para el autoplay este código funcionó perfectamente. Agregué la pausa con hover

jQuery(document).ready(function($) {
slideShowInterval = setInterval(()=>$('#post-cs .ps-next').trigger('click'), 5000);

$('#post-cs').mouseover(function(){
clearInterval(slideShowInterval);
});

$('#post-cs').mouseout(function(){
clearInterval(slideShowInterval);
/*setTimeout(1000);*/
slideShowInterval = setInterval(()=>$('#post-cs .ps-next').trigger('click'), 5000);  
});

});

0
<script type="text/javascript" charset="utf-8">
    jQuery(document).ready(function($) {
        slideShowInterval = setInterval(()=>$("#post-cs a.ps-next" ).trigger( "click"), 5000);

    $("#post-cs").mouseover(function(){
        clearInterval(slideShowInterval);
    });

    $("#post-cs").mouseout(function(){
        slideShowInterval = setInterval(()=>$("#post-cs a.ps-next").trigger( "click"), 5000);  
    });
    });
</script>
2
  • 1
    Tal y como está redactada, tu respuesta no es clara. Por favor, pulsa en editar para añadir detalles adicionales que ayuden a los demás a entender cómo esto responde a la pregunta formulada. Puedes encontrar más información sobre cómo escribir buenas respuestas en el centro de ayuda.
    – Comunidad Bot
    el 14 oct. 2022 a las 21:02
  • ¿Por qué tu respuesta es una copia incompleta de esta otra?
    – padaleiana
    el 15 oct. 2022 a las 10:30

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.