// when the DOM is ready...
function slider() {

    var $slider_panels = jQuery('#slider .scrollContainer > div');
    var $slider_container = jQuery('#slider .scrollContainer');
	
	
    jQuery('#slider').css('display', 'block');

    // if false, we'll float all the panels left and fix the width 
    // of the container
    var slider_horizontal = true;
	
	// elp
	// check if panels exists
	if ($slider_panels.length > 0) {

		// float the panels left if we're going slider_horizontal
		if (slider_horizontal) {
			$slider_panels.css({
				'float': 'left',
				'position': 'relative' // IE fix to ensure overflow is hidden
			});
			
			// calculate a new width for the container (so it holds all panels)
			$slider_container.css('width', $slider_panels[0].offsetWidth * $slider_panels.length);
		}
		
		// collect the scroll object, at the same time apply the hidden overflow
		// to remove the default scrollbars that will appear
		var $slider_scroll = jQuery('#slider .scroll').css('overflow', 'hidden');
		
		// apply our left + right buttons
		$slider_scroll.before('<img class="scrollButtons left leftDefault"  src="fileadmin/templates/css/screen/images/topinfo_left.gif" />').after('<img class="scrollButtons right rightDefault" src="fileadmin/templates/css/screen/images/topinfo_right.gif" />');
	
		
		// offset is used to move to *exactly* the right place, since I'm using
		// padding on my example, I need to subtract the amount of padding to
		// the offset.  Try removing this to get a good idea of the effect
		var slider_offset = parseInt((slider_horizontal ? $slider_container.css('paddingTop') : $slider_container.css('paddingLeft')) ||
		0) *
		-1;
		
				
		var slider_scrollOptions = {
			target: $slider_scroll, // the element that has the overflow
			// can be a selector which will be relative to the target
			items: $slider_panels,
			

			
			// selectors are NOT relative to document, i.e. make sure they're unique
			prev: 'img.leftDefault',
			next: 'img.rightDefault',
			
			// allow the scroll effect to run both directions
			axis: 'xy',
			offset: slider_offset,
			
			
			// duration of the sliding effect
			duration: 500,
			
			// easing - can be used with the easing plugin: 
			// http://gsgd.co.uk/sandbox/jquery/easing/
			easing: 'swing',
			
			constant: false, 
			lock: false,
			stop: true
			
		};

		// apply serialScroll to the slider - we chose this plugin because it 
		// supports// the indexed next and previous scroll along with hooking 
		// in to our navigation.
		//alert($('#slider'));
		jQuery('#slider').serialScroll(slider_scrollOptions);
		
		// now apply localScroll to hook any other arbitrary links to trigger 
		// the effect
		// $.localScroll(slider_scrollOptions);
		
		// finally, if the URL has a hash, move the slider in to position, 
		// setting the duration to 1 because I don't want it to scroll in the
		// very first page load.  We don't always need this, but it ensures
		// the positioning is absolutely spot on when the pages loads.
		slider_scrollOptions.duration = 1;
		jQuery.localScroll.hash(slider_scrollOptions);
	} 
}