$(document).ready(function() {
$('#slideshow').after('<div id="nav">').cycle({ 
    fx:     'fade', 
    speed:  '500', 
    timeout: 5000, 
    pager:  '#nav',
    after: onAfter,
     
    // callback fn that creates a thumbnail to use as pager anchor 
    pagerAnchorBuilder: function(idx, slide) { 
        return '<a href="#"><img src="http://localhost/amici/amiciweb/images/pager.gif" width="8" height="8"/></a>'; 
    } 
});

function onAfter(curr, next, opts, fwd) {
var index = opts.currSlide;
$('#prev')[index == 0 ? 'hide' : 'show']();
$('#next')[index == opts.slideCount - 1 ? 'hide' : 'show']();
//get the height of the current slide
var $ht = $(this).height();
//set the container's height to that of the current slide
$(this).parent().css("height", $ht);
}

});