//jQuery(document).ready(function() {
//    var selectedBanner = 0;
//    
//    jQuery('#banner-img').show();
//    jQuery('#banner-img').after('<div id="pagination"><ul>').cycle({
//        after: onAfter,
//        speed: 5000,
//        pager: '#pagination 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('#pagination a').click(onClick);
//    function onClick() {
//        jQuery('#pagination a').removeClass('active');
//        selectedBanner = parseInt(jQuery(this).attr('id').replace('lnkBanner', '')) - 1;
//        jQuery(this).addClass('active');    
//    }
//    jQuery('#banner-img').bind('click.cycle',onAfter);
//    function onAfter() {   
//        jQuery('#lnkBanner' + selectedBanner).removeClass('active');
//        selectedBanner == 6 ? selectedBanner = 1 : selectedBanner++;
//        jQuery('#lnkBanner' + selectedBanner).addClass('active');
//    }
//});

$(function() {
    $('#banner-img').before('<ul id="pagination">').cycle({
        fx: 'fade',
        speed: 'slow',
        timeout: 7000,
        pager: '#pagination',
        after: onAfter,
        pagerAnchorBuilder: function(idx, slide) {
            return '<li><a href="#">' + idx + '</a></li>';
        }
    });
});
function onAfter() {
    var curr = $(this);
    var img = curr.children();
     $('#output').html("<div id='outputTitle'>" + img.attr('title') + "</div><div id='outputDes'>" + img.attr('alt') + "</div>");
    Cufon.replace("#outputTitle", { fontFamily: 'Politica' });
}