Plugin jQuery Cycle – metti in pausa / riprendi il comportamento strano

Ho una presentazione in esecuzione con il fantastico ciclo plug-in, e quando si fa clic su un pulsante nello show, mostro un livello nascosto sulla pagina e invio un comando di ‘pausa’ al ciclo. Sto avendo due problemi:

  1. Quando viene ricevuto il comando di pausa, il ciclo torna immediatamente alla prima diapositiva della sequenza (perché ??), e non colpisce i callback precedenti / successivi.

  2. Dopo aver chiuso il layer, invio un comando ‘resume’ al ciclo. La presentazione riprende (dalla prima diapositiva, dove la pausa è stata lasciata), ma ora il ciclo non chiama affatto le mie chiamate prima / dopo, anche se la presentazione continua.

Quindi credo che la mia domanda sia: come posso sospendere / riprendere correttamente la presentazione in modo che questi strani comportamenti non si verifichino? (E per essere completamente chiari ed evitare qualsiasi confusione, non si tratta della funzione “pause on hover”, che funziona davvero bene per me. 🙂

Ecco il mio ciclo () init e le mie funzioni di callback. (Perché sto monitorando manualmente il nextSlide, chiedi? Perché il valore predefinito per la diapositiva corrente non viene aggiornato correttamente per i callback precedenti / successivi.)

$(document).ready(function() { $('#slideshow').cycle({ fx: 'fade', // choose your transition type, ex: fade, scrollUp, shuffle, etc... timeout: 4000, // milliseconds between slide transitions (0 to disable auto advance) speed: 1000, // speed of the transition (any valid fx speed value) pause: 1, // true to enable "pause on hover" delay: 0, // additional delay (in ms) for first transition (hint: can be negative) slideExpr: 'img', // expression for selecting slides (if something other than all children is required) before: moveArrow, // function to call when moving to next slide after: upd, // function to call when moving to next slide fastOnEvent: 'fast', }); }); var nextSlide = 0; function upd(a, b, c) { nextSlide = nextSlide + 1; // track which slide we're on c = $('#slideshow img').length; if(nextSlide > (c - 1)) nextSlide = 0; // wrap back to 1st } // move indicator showing which slide we're on function moveArrow(a, b, c) { $('#slide-indicator').attr('class', 'c'+nextSlide); $(".clickmap").hide(); // hide other clickmaps $(".clickmap.c"+nextSlide).show(); // show map for this slide return true; } 

Grazie per qualsiasi pensiero su questo

meglio, Eric

Ho avuto lo stesso problema, pausa e ripresa non funzionavano. Sembrava che avessi installato la versione lite, con la versione completa / completa funziona.

Non hai mostrato il tuo codice per l’invio del comando di pausa. C’è qualcosa di assolutamente sbagliato lì perché la pausa NON resetta la presentazione alla prima diapositiva.

Inoltre, non è necessario tenere traccia dell’indice delle diapositive. Il terzo argomento del callback prima / dopo è un object opzioni che ha lo stato interno della presentazione. Su quell’object troverai proprietà ‘currSlide’ e ‘slideCount’, tra molte altre.

So che questa è una domanda vecchia, ma ho avuto lo stesso problema. Il modo in cui mi sono aggirato è stato semplicemente creare la mia funzione per mettere in pausa e riprendere la presentazione con gli eventi di hover di JQuery.

Come ha sottolineato Eric in alcuni commenti, un problema correlato è che l’opzione di pausa del plugin consente solo il passaggio del mouse sopra l’elemento IMG per mettere in pausa la presentazione, quindi se hai qualcosa sopra le tue immagini, come un cercapersone o altri elementi decorativi, allora sei disossato.

Così ho inserito i miei elementi decorativi, il banner (che ho chiamato “#banner”) e il cercapersone in un div chiamato “# banner-container” e ho applicato questo codice per risolvere il mio problema:

 $('div#banner-container').hover(function(){ if(!$(this).hasClass('paused')){ $(this).addClass("paused"); $('div#banner').cycle("pause") } },function(){ if($(this).hasClass('paused')){ $(this).removeClass("paused"); $('div#banner').cycle("resume") } }); 

Il problema è nella versione di JQuery Cycle Plugin: la versione “lite” ignora i comandi di pausa / ripresa. L’utilizzo della versione completa potrebbe risolvere il problema.

EDIT: Scusa, ho sbagliato: ho provato entrambe le versioni ma ho avuto lo stesso problema usando la versione completa.