$(function() {

		//	Basic carousel
		$('#foo0').carouFredSel();

		//	Basic carousel + timer
		$('#foo1').carouFredSel({
			auto: {
				pauseOnHover: 'resume',
				onPauseStart: function( percentage, duration ) {
					$(this).trigger( 'configuration', ['width', function( value ) { 
						$('#timer1').stop().animate({
							width: value
						}, {
							duration: duration,
							easing: 'linear'
						});
					}]);
				},
				onPauseEnd: function( percentage, duration ) {
					$('#timer1').stop().width( 0 );
				},
				onPausePause: function( percentage, duration ) {
					$('#timer1').stop();
				}
			}
		});

		//	Scrolled by user interaction
		$("#foo2").carouFredSel({
			curcular: false,
			infinite: false,
			auto :{
	pauseDuration   : 6000,
	pauseOnHover    : true
	},
			prev : {	
				button	: "#foo2_prev",
				key		: "left"
			},
			next : { 
				button	: "#foo2_next",
				key		: "right"
			},
			pagination	: "#foo2_pag"
		});


		//	Variable number of visible items with variable sizes
		$('#foo3').carouFredSel({
			width: 360,
			height: 'auto',
			scroll: 1,
			next: '#next3',
			prev: '#prev3',
			auto: false
		});

		//	Fluid layout example
		$(window).resize(function() {
			$('#fooF').carouFredSel({
				width: $(window).width(),
				scroll: 2
			});					
		}).resize();
	});