var _slideList = null;
var _slideEl = null;
var _maxWidthEl = 826; //px
var _minWidthEl = 27;//px
var _durationSlide = 1000;
var _durationFadeContent = 600;
var switchTime = 8000;

$(document).ready(function(){
	_slideList = $('div.visual');
	_slideEl = $('div.visual li');
	
	if(_slideEl.filter('.active').length) {
		_slideEl.filter('.active').animate({width:_maxWidthEl},{queue:false,duration:_durationSlide});
		_slideEl.not('.active').animate({width:_minWidthEl},{queue:false,duration:_durationSlide});
	}

	_timer = setTimeout('nextElSlide()',switchTime)
	
	_slideEl.hover(function(){
		if (_timer) clearTimeout(_timer)
		_slideEl.removeClass('active');
		$(this).animate({width:_maxWidthEl},{queue:false,duration:_durationSlide}).addClass('active');
		_slideEl.not(this).animate({width:_minWidthEl},{queue:false,duration:_durationSlide});
		
	}, function(){
		_timer = setTimeout('nextElSlide()',switchTime);
	});
});

function nextElSlide(){
	if (_slideEl.filter('.active').next().length) {
		_slideEl.filter('.active').removeClass('active').next().addClass('active');
	}
	else {
		_slideEl.filter('.active').removeClass('active');
		_slideEl.eq(0).addClass('active');
	}
	_slideEl.filter('.active').animate({width:_maxWidthEl},{queue:false,duration:_durationSlide});
	_slideEl.not('.active').animate({width:_minWidthEl},{queue:false,duration:_durationSlide});
	
	_timer = setTimeout('nextElSlide()',switchTime);
}