$(function() {    
    // redefine Cycle's updateActivePagerLink function 
    $.fn.cycle.updateActivePagerLink = function(pager, currSlideIndex) { 
        $(pager).find('a').removeClass('activeSlide').filter('a:eq('+currSlideIndex+')').addClass('activeSlide')
    };
    
    $('#slides').after('<div id="nav">').cycle({
        fx:     'scrollHorz',
        speed:  '1500',
        timeout: 6000,
        pager:  '#nav',
        pagerAnchorBuilder: function(idx, slide) {
          return '<a href="#">' + (idx + 1) + '</a>';
        }
    });

});