JQuery Delay on sliders

JavaScript
1

I have 3 sliders on my home page and I would like to make them start one after the other, so 1st would start immediately, then after a short delay the second one, and later the 3rd, so they don’t make the transition at the same time. The slider I am using is Avia Slider http://aviathemes.com/aviaslider/

Trying this code but they are still running synchronously:



// avia slider activation for left-slider
$('#left-slider').aviaSlider({
blockSize: {height: 40, width:'full'},
display: 'topleft',
transition: 'fade',
betweenBlockDelay:150,
animationSpeed: 500,
switchMovement: false,
appendControlls:'#left-slider-controlls',
autorotationSpeed:3
});

// avia slider activation for middle-slider
$('#middle-slider').delay(800).aviaSlider({
blockSize: {height: 40, width:'full'},
display: 'topleft',
transition: 'fade',
betweenBlockDelay:150,
animationSpeed: 500,
switchMovement: false,
appendControlls:'#middle-slider-controlls',
autorotationSpeed:3
});

// avia slider activation for right-slider
$('#right-slider').delay(1600).aviaSlider({
blockSize: {height: 40, width:'full'},
display: 'topleft',
transition: 'fade',
betweenBlockDelay:150,
animationSpeed: 500,
switchMovement: false,
appendControlls:'#right-slider-controlls',
autorotationSpeed:3
});

How can I achieve what I need?

2 

// avia slider activation for left-slider
$('#left-slider').aviaSlider({
blockSize: {height: 40, width:'full'},
display: 'topleft',
transition: 'fade',
betweenBlockDelay:150,
animationSpeed: 500,
switchMovement: false,
appendControlls:'#left-slider-controlls',
autorotationSpeed:3
});

setTimeout(funtion() {
	// avia slider activation for middle-slider
	$('#middle-slider').aviaSlider({
		blockSize: {height: 40, width:'full'},
		display: 'topleft',
		transition: 'fade',
		betweenBlockDelay:150,
		animationSpeed: 500,
		switchMovement: false,
		appendControlls:'#middle-slider-controlls',
		autorotationSpeed:3
	});
},800);

setTimeout(function() {
	// avia slider activation for right-slider
	$('#right-slider').aviaSlider({
		blockSize: {height: 40, width:'full'},
		display: 'topleft',
		transition: 'fade',
		betweenBlockDelay:150,
		animationSpeed: 500,
		switchMovement: false,
		appendControlls:'#right-slider-controlls',
		autorotationSpeed:3
	});
},1600);
3

Thanks, I’m getting an error in the script, probably because that code is enclosed within this:

$(document).ready(function(){

});

How can I fix it?