How to prevent cycle plugin to autoplay?

Question

Im using cycle plugin and its working well. But the slider keeps sliding and i dont know what option should i use to prevent it autoplay.

$('#thumbs').cycle({
            fx: 'scrollHorz',
            prev: '.thumbPrev',
            next: '.thumbNext'
        });

I also checked cycle's options reference http://jquery.malsup.com/cycle/options.html but i did not found anything usefull..

`autostop: 0, // true to end slideshow after X transitions (where X == slide count) ` and `autostopCount: 0, // number of transitions (optionally used with autostop to define X)` in conjunction may be? — Ejaz, Apr 23 '13 at 18:01
I provided you a reference from the author of the plugin answering the same question on the jquery forums. — lucuma, Apr 23 '13 at 19:30

score 7 · Accepted Answer · answered Apr 23 '13 at 18:06

7

I found the solution

$(elem).cycle({
    timeout: 0 //milliseconds between slide transitions (0 to disable auto advance)
});

timeout is standard defined 4000

answered Apr 23 '13 at 18:06

Ramon Vasconcelos

947
3
14
31

lucuma · Answer 2 · 2013-04-23T19:30:07.820

2

Immediately after the cycle:

$('#thumbs').cycle('pause')

Or per the author of jquery cycle, a more condensed version of my original answer:

    $('#thumbs').cycle({
        fx: 'scrollHorz',
        prev: '.thumbPrev',
        next: '.thumbNext'
    }).cycle('pause');

reference: http://forum.jquery.com/topic/cycle-plugin-no-autostart-click-to-start-slideshow

edited Apr 23 '13 at 19:30

answered Apr 23 '13 at 18:03

lucuma

18,247
4
66
91

score 0 · Answer 3 · answered Dec 31 '13 at 13:48

Set timeout to zero. Here is an example:

<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="js/jquery.cycle.all.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#porta-slide-demo').cycle({ 
    fx:     'fade', 
    speed:  'fast', 
    timeout: 0, 
    next:   '#para', 
    prev:   '#prapa' 
});
});
</script>

..........

<div id="porta-slide-demo">
<img src="demo-images/01.jpg" width="450" height="300" />
<img src="demo-images/02.jpg" width="450" height="300" />
<img src="demo-images/03.jpg" width="450" height="300" />
</div>
    <div>
    <a id="prapa" href="#">Prapa</a>
    <a id="para" href="#">Para</a>
    </div>

How to prevent cycle plugin to autoplay?

3 Answers3