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

    var $info_panels = jQuery('#slider_info .scrollContainer > div');
    var $info_container = jQuery('#slider_info .scrollContainer');
	var $initalPadding = $info_container.css('paddingLeft');
	
    // if false, we'll float all the panels left and fix the width 
    // of the container
    var info_horizontal = true;
	
	// elp
	// check if panels exists
	if ($info_panels.length > 0) {
	
		// float the panels left if we're going info_horizontal
		if (info_horizontal) {
			$info_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)
			$info_container.css('width', $info_panels[0].offsetWidth * $info_panels.length);
		}
		
		// collect the scroll object, at the same time apply the hidden overflow
		// to remove the default scrollbars that will appear
		var $info_scroll = jQuery('#slider_info .scroll').css('overflow', 'hidden');
		
		// apply our left + right buttons
		$info_scroll.before('<img class="scrollButtons left leftInfo" src="fileadmin/templates/css/screen/images/news_left.gif" />').after('<img class="scrollButtons right rightInfo" src="fileadmin/templates/css/screen/images/news_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 info_offset = parseInt((info_horizontal ? $info_container.css('paddingTop') : $info_container.css('paddingLeft')) || 0) * -1;

		
		var info_scrollOptions = {
			target: $info_scroll, // the element that has the overflow
			// can be a selector which will be relative to the target
			items: $info_panels,
			
			
			// selectors are NOT relative to document, i.e. make sure they're unique
			prev: 'img.leftInfo',
			next: 'img.rightInfo',
			
			// allow the scroll effect to run both directions
			axis: 'xy',
			
			offset: info_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_info'));
		jQuery('#slider_info').serialScroll(info_scrollOptions);
		
		// now apply localScroll to hook any other arbitrary links to trigger 
		// the effect
		//$.localScroll(info_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.
		info_scrollOptions.duration = 1;
		jQuery.localScroll.hash(info_scrollOptions);
	}
}