function navigation() {
	$('#nav > li').each(function(){
		var _this = this;
		_this.drop = $(this).find('div.drop');
		if(_this.drop.length){
			_this.drop.css('display','block');
			_this.drop.w = _this.drop.outerWidth(true);
			_this.drop.css({
				display:'',
				width: _this.drop.w < 208 ? '208px' : _this.drop.w  +'px'
			});
			_this.drop.find('ul:eq(0)').css({
				width: _this.drop.w < 162 ? '162px' : _this.drop.w - 46 +'px'
			})
			if(typeof(document.body.style.maxHeight) == 'undefined'){
				var _frame = $('<iframe src="javascript:false" />');
				_this.drop.append(_frame);
				_frame.css({
					opacity: 0,
					clear: 'both',
					position: 'absolute',
					left: 0,
					top: 0,
					width: _this.drop.w+'px',
					height: _this.drop.outerHeight(true) - 130+'px',
					zIndex: 0
				});
			}
			if($.browser.msie && $.browser.version < 8){
				_this.drop.find('li').css('width', _this.drop.w < 162 ? '162px' : _this.drop.w - 46 +'px');
			}
		}
	});
}
function slideShow(){
var _swichTime = 5000;
	var _d = 700;
	var _overlayOpacity = 0.45;
	$('div.gallery-wrapper').each(function(){
		var _this = $(this);
		var _list = $('.image-box li', _this);
		var _btnPrev = $('.link-prev', _this);
		var _btnNext = $('.link-next', _this);
		var _linksParent = $('#carusel div.hold', _this);
		var _moover = $('> ul', _linksParent);
		var _links = $('li', _moover);
		var _ThumbsOver = _links.find('em').css('opacity', _overlayOpacity);
		var _mM =0, _direction = false;
		var _maxMargin = _links.outerWidth(true)*_links.length - _linksParent.width();
		var _a = _list.index(_list.filter('.active'));
		if(_a==-1) _a=0;
		var _t = null;
		if(_swichTime) _swichTime +=_d;
		_list.removeClass('active').hide().eq(_a).addClass('active').show();
		_links.removeClass('active').eq(_a).addClass('active');
		_ThumbsOver.eq(_a).css({opacity: 0});
		var _t;
//fade
		if (_swichTime){
			_t = setTimeout(function(){
				if(_a < _list.length - 1) changeEl(_a + 1);
				else changeEl(0);
			}, _swichTime);
		}
		if (_btnPrev){
			_btnPrev.click(function(){
				var _prevItem = 0;
				if (_a > 0) _prevItem = _a-1;
				else _prevItem = _list.length-1;
				changeEl(_prevItem);
				return false;
			});
		};
		if (_btnNext){
			_btnNext.click(function(){
				var _nextItem = 0;
				if (_a < _list.length - 1) _nextItem = _a+1;
				else _nextItem = 0;
				changeEl(_nextItem);
				return false;
			});
		};
		if(_links){
			_links.click(function(){
				if(!$(this).hasClass('active')) changeEl(_links.index(this));
				return false;
			}).mouseenter(function(){
				$(this).find('em').animate({opacity: 0},{duration:300, queue: false});
			}).mouseleave(function(){
				if(!$(this).hasClass('active')) $(this).find('em').animate({opacity: _overlayOpacity},{duration:300, queue: false});
			});
		};
		function changeEl(_ind){
			if(_t) clearTimeout(_t);
			if(_ind != _a){
				var _direction = getActivePosition(_ind);
				if(_direction){
					moveGallery(_ind);
				}
				_list.eq(_a).removeClass('active').css({display:'block', zIndex:5}).animate({opacity: 0}, {queue:false, duration:_d,complete: function(){
					$(this).css({zIndex: 2});
				}})
				_list.eq(_ind).addClass('active').css({display:'block', opacity: 1});
				_links.removeClass('active').eq(_ind).addClass('active');
				_ThumbsOver.eq(_a).animate({opacity: _overlayOpacity},{duration:300, queue: false});
				_ThumbsOver.eq(_ind).animate({opacity: 0},{duration:300, queue: false});
				_a = _ind;
			}
			if (_swichTime){
				_t = setTimeout(function(){
					if(_a < _list.length - 1) changeEl(_a + 1);
					else changeEl(0);
				}, _swichTime);
			};
		};
//get Active position
		function getActivePosition(_next){
			var _curentPosition = _links.eq(_next).offset().left;
			var _ThumbsWindowPosition = _linksParent.offset().left;
			if(_curentPosition > _ThumbsWindowPosition && _curentPosition < (_ThumbsWindowPosition+_linksParent.width())){
				//we can see active thumbs now
				return false;
			}else{
				//need scroll thumbs
				return true;
			}
		}
//move thumbs
		function moveGallery(_next){
			if(_a > _next){
				_mM = _links.outerWidth(true)*_next - _linksParent.width()+_links.outerWidth(true);
				if(_mM < 0) _mM = 0;
			}else{
				_mM = _links.outerWidth(true)*_next;
				if(_mM > _maxMargin) _mM = _maxMargin;
			}
			_moover.animate({marginLeft: -_mM},{duration: _d, queue: false});
			_direction = false;
		}
	})
}

$(document).ready(function(){
	navigation();
	slideShow();
});