$(document).ready(function () {

var $panels = $('#slider .scrollerContainer > div');

var $container = $('#slider .scrollerContainer');



var horizontal = true;



if (horizontal) {

$panels.css({

'float' : 'left',

'position' : 'relative' 

});





$container.css('width', $panels[0].offsetWidth * $panels.length);

}

var $scroll = $('#slider .scroller').css('overflow', 'hidden');



 

$scroll

.before('<img class="Buttons left" src="img/left_slider_button.png" />')

.after('<img class="Buttons right" src="img/right_slider_button.png" />');



function selectNav() {

$(this)

.parents('ul:first')

.find('a')

.removeClass('selected')

.end()

.end()

.addClass('selected');

}



$('#slider .navigation').find('a').click(selectNav);



 

function trigger(data) {

var el = $('#slider .navigation').find('a[href$="' + data.id + '"]').get(0);

selectNav.call(el);

}



if (window.location.hash) {

trigger({ id : window.location.hash.substr(1) });

} else {

$('ul.navigation a:first').click();

}



var offset = parseInt((horizontal ? 

$container.css('paddingTop') : 

$container.css('paddingLeft')) 

|| 0) * -1;





var scrollOptions = {

target: $scroll, 

items: $panels,

navigation: '.navigation a',

prev: 'img.left', 

next: 'img.right',

axis: 'xy',

onAfter: trigger, 

offset: offset,

duration: 400,

easing: 'swing'

};

 

$('#slider').serialScroll(scrollOptions);

$.localScroll(scrollOptions);

scrollOptions.duration = 1;

$.localScroll.hash(scrollOptions);

});

//End Slider script