Databases
StackOverflow2013
Postsdbo
POPlaying a jquery cycle slideshow on click, then pausing after a delay
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POPlaying a jquery cycle slideshow on click, then pausing after a delay
    text
    copied!<p>I'm using the jQuery Cycle plugin to create a text "scrambler": the "cycler" div loads with a single text sentence, which doesn't change. Then on clicking a button, the text should (a) rapidly cycle through all the other text strings and (b) stop automatically after 1 second on a different (random) text string. Clicking the button again should repeat the effect, each time coming to rest on a different snippet of text.</p> <p>Here is my code. I am avoiding <code>autostop</code> and <code>autostopcount</code>, since I believe "stopping" in Cycle's terms destroys the instance of the slideshow and doesn't easily allow re-starting. I think I just want to pause and resume the slideshow</p> <pre><code> // Configure cycle slideshow $('#cycler').cycle({ fx: 'none', speed: '1', timeout: '10', random:1, }).cycle('pause'); // Pause the slideshow immediately </code></pre> <p>I can configure a dummy link to manually pause/resume the slideshow on each click with no problems:</p> <pre><code> // Toggle slideshow when clicking button $('#cycler-switch').click(function(){ $('#cycler').cycle('toggle'); return false; }); </code></pre> <p>But since I want to pause the slideshow automatically, 1 second after the button being clicked, I changed the above code to the following:</p> <pre><code> // Play then Pause $('#cycler-switch').click(function(){ $('#cycler').cycle('toggle').delay(1000).cycle('toggle'); return false; }); </code></pre> <p>Unfortunately this has the effect that the slideshow won't even start playing on click.</p> <p>Any ideas? Should I be using setTimeout instead of .delay() for some reason? Thanks.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload