$(document).ready(function(){
$('li').each(function(index) {
    $('<div class="slider_item slider_off" rel="'+parseInt(index +1)+'">'+parseInt(index+1)+'</div>').appendTo('#slider_nav');
  	});
  	$('.slider_item:first').css('margin-top','30px').removeClass('slider_off').addClass('slider_on');
	zoomImage();

$('.slider_item').live('click', function() {
	$("#panel").clearQueue();
	var margin=parseInt(($(this).attr('rel')*984)-984);
	var active=parseInt($(this).attr('rel')-1);
  	$('#panel').animate({ marginLeft: -margin }, 1000, function() {
  		$('.slider_on').removeClass('slider_on').addClass('slider_off');
  		$('.slider_item').eq(active).addClass('slider_on');
  		$('#panel').delay(17000);
  		zoomImage();
  	});
});
});

function zoomImage(start) {
var length=$('#slider li').length;
var active=$('.slider_on').attr('rel');
if(active==length) {
	$('#panel').delay(17000);
	$('#panel').animate({ marginLeft:'0'}, 1, function() {
  	$('.slider_on').removeClass('slider_on').addClass('slider_off');
  	$('.slider_item:first').addClass('slider_on');
  	zoomImage();
  	});
  	
}
else {
	var margin=parseInt(($('.slider_on').attr('rel')*984));
	var active=parseInt($('.slider_on').attr('rel'));
  	$('#panel').delay(17000);
  	$('#panel').animate({ marginLeft: -margin }, 1000, function() {
  		$('.slider_on').removeClass('slider_on').addClass('slider_off');
  		$('.slider_item').eq(active).addClass('slider_on');
  		
  		zoomImage();
  	});
  	
}
}