$(function(){
	initDrop();
})

function initDrop(){
	var _main = $('#twocolumns');
	var _overlay = $('<div id="overlay"></div>');
	_main.append(_overlay);
	var _opac = 0.5;
	_overlay.w = _overlay.parent().width()-10;
	_overlay.h = _overlay.parent().height();
	_overlay.css({
		background: '#fff',
		width: _overlay.w+'px',
		height: _overlay.h + 'px',
		position: 'absolute',
		zIndex: 98,
		opacity: _opac,
		top: 0,
		left: '4px',
		display: 'none'
	})
	var _navLink = $('#nav > li > a');
	_navLink.click(function(){
		var _this = $(this);
		if(_this.parent().hasClass('hover')){
			_this.parent().removeClass('hover');
			fadeAll(false);
		}else{
			if(_navLink.parent().filter('.hover').length){
				_navLink.parent().filter('.hover').removeClass('hover');
				fadeAll(false);
				_this.parent().addClass('hover');
				fadeAll(true);
			}else{
				_this.parent().addClass('hover');
				fadeAll(true);
			}
			
		}
		return false;
	});
function fadeAll(bool){
	var _navLi = $('#nav > li');
	if(bool){
		_navLi.not('.hover').css({opacity: _opac});
		_overlay.css({display: 'block'});
		
	}else{
		_navLi.css({opacity: '1'}).css({opacity: 'auto'});
		_overlay.css({display: 'none'});
	}
}
}