/**
	*	Simple banner slider. Requires a container element with an id or class, which must contain a <ul> with <li>'s. The content of the <li> can be anything.
	*	Takes an ID, height and width in the following format: 
	*	slidingBanners('#frame', 250, 500);
	*	#frame is a CSS selector
	*	250 is the height as an integer
	* 500 is the width as an integer
	*
**/

function slidingBanners(frame, h, w){
	$(frame).addClass('slideFrame');
	$(frame + ' > ul').addClass('slideContent');
	$(frame + ' > ul > li').addClass('slideItem');
	
	$('.slideFrame').css({
		position: 'relative',
		overflow: 'hidden',
		height: h,
		width: w
	});
	
	var siCount = $('.slideItem').size();
	var scWidth = (w * siCount);
	$('.slideContent').css({
		height: h,
		width: scWidth,
		position: 'absolute'
	});
	
	$('.slideItem').css({
		height: h,
		width: w,
		display: 'block',
		float: 'left'
	});
	
	setInterval(function(){animateBanner(w, scWidth, '.slideItem', '.slideContent')}, 5000);
}

function animateBanner(w, cw, i, c){
	// iW = item width, cW = container width, i = item, c = container
	if($(c).css('left') == (-1 * (cw - w) + 'px'))
	{
		$(c).animate({left: '0'}, w);
	}else{
		$(c).animate({left: '-=' + w}, w);
	}
}