$(document).ready(function() {
	
	$("#banner1").scrollable({clickable:false,size:5}).circular().autoscroll({autoplay: true,autopause:true,steps:5,interval:5000});
	//$("#banner1").scrollable({clickable:false,size:5});
	

	

	//To switch directions up/down and left/right just place a "-" in front of the top/left attribute

				//Vertical Sliding

	$('.banner_box.slidedown').hover(function(){

		$(".cover", this).stop().animate({top:'-100px'},{queue:false,duration:30});

	}, function() {

		$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:30});

	});

	//Horizontal Sliding

	$('.banner_box.slideright').hover(function(){

		$(".cover", this).stop().animate({left:'325px'},{queue:false,duration:300});

	}, function() {

		$(".cover", this).stop().animate({left:'0px'},{queue:false,duration:300});

	});

	//Diagnal Sliding

	$('.banner_box.thecombo').hover(function(){

		$(".cover", this).stop().animate({top:'260px', left:'325px'},{queue:false,duration:300});

	}, function() {

		$(".cover", this).stop().animate({top:'0px', left:'0px'},{queue:false,duration:300});

	});

	//Partial Sliding (Only show some of background)

	$('.banner_box.peek').hover(function(){

		$(".cover", this).stop().animate({top:'90px'},{queue:false,duration:160});

	}, function() {

		$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:160});

	});

	//Full Caption Sliding (Hidden to Visible)

	$('.banner_box.captionfull').hover(function(){

		$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300});

	}, function() {

		$(".cover", this).stop().animate({top:'70px'},{queue:false,duration:300});

	});

	//Caption Sliding (Partially Hidden to Visible)

	$('.banner_box.caption').hover(function(){

		$(".cover", this).stop().animate({top:'160px'},{queue:false,duration:160});

	}, function() {

		$(".cover", this).stop().animate({top:'220px'},{queue:false,duration:160});

	});

});