$(document).ready(function(){
	var _navEl = $('ul.nav > li.sub:has(div), ul.nav > li.sub ul > li:has(div)');
	var _durationSlide = 300;
	
	_navEl.each(function(i, _el){
		_el = $(_el);
		var _ul = _el.find('> div > ul');
		var _parent = _ul.parent();
		_el.h = _ul.height();
		_el.w = _ul.width();
		
		if (_el.parent().is('ul.nav')) {
			_parent.css({
				'height':0,
				'overflow':'hidden'
			});
			_ul.css({
				'marginTop':-_el.h
			});
			
			_el.hover(function(){
				this.hoverEl = true;
				var _this = this;
				$(this).addClass('subhover');
				_parent
					.css('overflow','hidden')
					.animate({height:_el.h},{queue:false,duration:_durationSlide,complete:function(){
						if (_this.hoverEl)
							_parent.css('overflow','visible')
					}});
				_ul.animate({marginTop:0},{queue:false,duration:_durationSlide});
			}, function(){
				this.hoverEl = false;
				var _this = this;
				_parent
					.css('overflow','hidden')
					.animate({height:0},{queue:false,duration:_durationSlide});
				_ul.animate({marginTop:-_el.h},{queue:false,duration:_durationSlide, complete:function(){
					if (!_this.hoverEl)
						$(_this).removeClass('subhover');
				}});
			});
		} else {
			_parent.css({
				'width':0,
				'height':'auto',
				'overflow':'hidden'
			});
			if (_parent.parents('.flip').length) {
				_ul.css({
					'marginLeft':-_el.w
				});
				
				_el.hover(function(){
					this.hoverEl = true;
					$(this).addClass('subhover');
					_parent
						.animate({
							width:_el.w,
							marginLeft:-_el.w
						},{queue:false,duration:_durationSlide});
					_ul.animate({marginRight:0},{queue:false,duration:_durationSlide});
				}, function(){
					this.hoverEl = false;
					var _this = this;
					_parent
						.animate({
							width:0,
							marginLeft:0
						},{queue:false,duration:_durationSlide});
					_ul.animate({marginRight:-_el.w},{queue:false,duration:_durationSlide, complete:function(){
						if (!_this.hoverEl) {
							$(_this).removeClass('subhover');
						}
					}});
				});
			} else {
				
				_ul.css({
					'marginRight':-_el.w
				});
				
				_el.hover(function(){
					this.hoverEl = true;
					$(this).addClass('subhover');
					_parent
						.css('marginLeft',_el.w-2)
						.animate({
							width:_el.w
						},{queue:false,duration:_durationSlide});
					_ul.animate({marginRight:0},{queue:false,duration:_durationSlide});
				}, function(){
					this.hoverEl = false;
					var _this = this;
					_parent
						.animate({
							width:0
						},{queue:false,duration:_durationSlide});
					_ul.animate({marginLeft:-_el.w},{queue:false,duration:_durationSlide, complete:function(){
						if (!_this.hoverEl) {
							$(_this).removeClass('subhover');
						}
					}});
				});
			}
		}
	});
});