function pager() {
    var items = $('.items');
    items.hide();
    items.eq(0).show();

    for (var i=0, j=items.length; i<j; i++) {
        var link = ["<a href='#content' href='' class='","pager_in' >#</a>"].join('');
        $('.pager_prev').after(link);
    }
    $('.pager_in').eq(0).addClass('pager_on');

    var links = $('.pager_in');

    links.click(function(){
        var index = links.index(this);
        items.hide();
        items.eq(index).fadeIn();
        links.removeClass('pager_on');
        $(this).addClass('pager_on');
        return false;
    });
    
    $('.pager_prev').click(function(){
        var now = $('.pager_on');
        var index = links.index(now);
        if (index <= 0 || index == -1) {
            now.removeClass('pager_on');
            links.eq(links.length-1).addClass('pager_on');
            items.hide().eq(links.length-1).fadeIn();
        } else {
            now.removeClass('pager_on');
            now.prev().addClass('pager_on');
            items.hide().eq(index).fadeIn();
        }
        return false;
    });

    $('.pager_next').click(function(){
        var now = $('.pager_on');
        var index = links.index(now);
        if (index >= links.length-1 || index == -1) {
            now.removeClass('pager_on');
            links.eq(0).addClass('pager_on');
            items.hide().eq(0).fadeIn();
        } else {
            now.removeClass('pager_on');
            now.next().addClass('pager_on');
            items.hide().eq(index).fadeIn();
        }
        return false;
    });
}

function fadeToggle(){
    $('#content').hide();
    window.setTimeout(function(){
        $('#content').fadeIn();
        $('#footer').css({'margin-top':'20px'});
    },500);
    $('#nav a').click(function(){
        $('#footer').css({'margin-top':'500px'});
        $('#content').fadeOut();
        $('#nav li').removeClass('current_page_item');
        $(this).parent().addClass('current_page_item');
        $('#nav a').removeClass('nav_on');
        $(this).addClass('nav_on');
        $('#header').after('<div class="loading"></div>');
        var self = this;
        window.setTimeout(function(){
            location.href = self.href;
        },500);
        return false;
    });
}

$(document).ready(function(){
    fadeToggle();
    pager();
});

