jQuery(document).ready(function() {
    var selectedBanner = 0;

    jQuery('#home_banner').show();
    jQuery('#home_banner').after('<div id="banner-links"><ul>').cycle({
        after: onAfter,
        pager: '#banner-links ul',
        pagerAnchorBuilder: function(idx, slide) {
            var anchor = '';
            if ((idx + 1) == selectedBanner) {
                anchor = '<li><a href="#" class="active" id="lnkBanner' + (idx + 1) + '">' + (idx + 1) + '</a></li>';
            } else {
                anchor = '<li><a href="#" id="lnkBanner' + (idx + 1) + '">' + (idx + 1) + '</a></li>';
            }
            return anchor;
        }
    });

    jQuery('#banner-links a').click(function() {
        jQuery('#banner-links a').removeClass('active');
        selectedBanner = parseInt(jQuery(this).attr('id').replace('lnkBanner', '')) - 1;
        jQuery(this).addClass('active');
    });

    function onAfter() {        
        jQuery('#lnkBanner' + selectedBanner).removeClass('active');
        selectedBanner == 5 ? selectedBanner = 1 : selectedBanner++;
        jQuery('#lnkBanner' + selectedBanner).addClass('active');
    }
});