$(document).ready(function() {

    $('#slideshow').cycle({
        fx: 'fade', // choose your transition type, ex: fade, scrollUp, shuffle, etc...
        speed: 1000,
        timeout: 9000,
        pager: '#nav',
        before: onBefore 
        //after: onAfter
    });
    /*$('#slideshow').before('<div id="nav" class="nav">');*/
    
});

function onBefore(currSlideElement, nextSlideElement,
options, forwardFlag) {
    $('.output').html(this.title);
}
function onAfter(currSlideElement, nextSlideElement,
options, forwardFlag) {
    $('.output').html(this.title);
}