function initHistory() {
    
    $("#historyslider").slider({
        value: 1,
        min: 1,
        max: 15,
        step: 1,
        slide: function( event, ui ) {
            historyPanel='#hpanel'+ui.value;
            $('#historycontent').scrollTo('#hpanel'+ui.value,{
                duration: 1000
            });
            $('#historydate div').css('margin-left',(ui.value-1)*35+'px').text(historyDates[(ui.value-1)]);
        }
    });

    $("#historyprev, #historynext").hover(function(){
        $(this).css('background-position','-410px 0px');
    },function(){
        $(this).css('background-position','0px 0px');
    });


    $("#historyprev").click(function() {
        var k = historyPanel.replace(/#hpanel/,'');
        if (k<=1) k=15; else k = parseInt(k)-1;
        historyPanel='#hpanel'+k;
        $('#historycontent').scrollTo(historyPanel,{
            duration: 1000
        });
        $('#historydate div').css('margin-left',(k-1)*35+'px').text(historyDates[(k-1)]);
        $('#historyslider a').css('left',parseFloat(100/14*(k-1))+'%');
    });

    $("#historynext").click(function() {
        var k = historyPanel.replace(/#hpanel/,'');
        if (k>=15) k=1; else k = parseInt(k)+parseInt(1);
        historyPanel='#hpanel'+k;
        $('#historycontent').scrollTo(historyPanel,{
            duration: 1000
        });
        $('#historydate div').css('margin-left',(k-1)*35+'px').text(historyDates[(k-1)]);
        $('#historyslider a').css('left',parseFloat(100/14*(k-1))+'%');
    });
}