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..

Was it helpful?

Solution

I found the solution

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

timeout is standard defined 4000

OTHER TIPS

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

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>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top