$(document).ready(function () {
    //1. lav scroo 
    //2. handle this selection 
    //3. Pre og next images buttons
    // 4. support vertical and horisontialt
    
    var $panels = $('#slider .panel');
    var $container = $('#slider .scrollContainer');
    var $scroll = $('#slider .scroll').css('overflow', 'hidden');
    
//    $scroll
//        .before('<img src="camera2.png" alt="Cam" class="scrollButtons left" />')
//        .after('<img src="camera2.png" alt="Cam" class="scrollButtons right" />')
        
    $('#slider .navigation a').click(selectNav);
    
        function selectNav() {
             $(this)
                .parents('ul:first')
                    .find('a')
                        .removeClass('selected')
                    .end()
                .end()
                .addClass('selected'); 
        }
        
    var scrollOptions = {
        target: $scroll, 
        items: $panels, 
        navigation: '.navigation a', 
        prev: 'img.left',
        next: 'img.right',
        axis: 'xy', 
        duration: 500,
        easing: 'swing'

        
        //TODO FINISH 
    };
    
 
    
    $('#slider').serialScroll(scrollOptions);
    
    //Lokale links der virker med scroll effekt
    
});