‹‹ cycle homejQuery Cycle Plugin - 'goto' Demo 4 (with various transition effects)

The code below dynamically creates buttons with click handlers that cause the slideshow to go to a particular slide. As an added bonus, it uses different effects to transition the slides when the buttons are clicked.

$(function() {
    var $bc = $('#buttonContainer');

    var $container = $('#container').cycle({
        fx: 'scrollLeft',
        speed: 300,
        autostop: 1,
        autostopCount: 1
    });

    var manualEffects = ['fade','turnUp','curtainY','blindZ','zoom'];

    $container.children().each(function(i) {
        $('<input type="button" value="'+(i+1)+'" />')
            .appendTo($bc).click(function() {
                // pass fx name as 2nd arg for a one-time override
                $container.cycle(i, manualEffects[i]);
                return false;
            });
    });

});