window.addEvent('domready', function() {
	
// Menu 2
	var el = $('unterMenu_2');
	$('menu_2').addEvent('click', function(){
		//alert($('menu_2').offsetHeight);
		//e.stop();
		if(el.offsetHeight < 5) {		
			el.fade(1);
			el.tween('height', 50);
		} else {
			el.fade(0);
			el.tween('height', 0);		
		}
		return false; // alternative syntax to stop the event
	});
	
// Menu 3
	var el = $('unterMenu_3');
	$('menu_3').addEvent('click', function(){
		//alert($('menu_2').offsetHeight);
		//e.stop();
		if(el.offsetHeight < 5) {		
			el.fade(1);
			el.tween('height', 50);
		} else {
			el.fade(0);
			el.tween('height', 0);		
		}
		return false; // alternative syntax to stop the event
	});
	
	
	
	
	
//	$('unterMenu').addEvent('mouseover', el.fade.bind(el, [1]));
//	$('unterMenu').addEvent('mouseout', el.fade.bind(el, [0]));
	
/*	// Long version
	$('tweenOpacity').addEvent('click', function(e) {
		// You often will need to stop propagation of the event
		e.stop();
		el.fade(1);
	});
	
	$('tweenOpacity1').addEvent('click', function(e) {
		e.stop();
		el.fade(0.3);
	});
	
	
	//SECOND EXAMPLE
	var otherEl = $('myOtherElement');
	
	$('heightEffect').addEvent('click', function(){
		otherEl.tween('height', 50);
		return false; // alternative syntax to stop the event
	});
	
	// We can also create an Fx.Tween instance and use a wrapper variable
	
	var myEffect = new Fx.Tween(otherEl);
	$('colorEffect').addEvent('click', function(e) {
		e.stop();
		// We change the background-color of the element
		myEffect.start('background-color', '#E6EFC2');
	});
	
	$('borderEffect').addEvent('click', function(e) {
		e.stop();
		otherEl.tween('border', '10px dashed #C6D880');
	});
	
	$('resetEffect').addEvent('click', function(e) {
		e.stop();
		otherEl.erase('style');
	});
	
	
	//THIRD EXAMPLE
	
	var anotherEl = $('anotherElement');
	
	// Again we are able to create a morph instance
	var morph = new Fx.Morph('anotherElement');
	
	$('morphEffect').addEvent('click', function(e) {
		e.stop();
		morph.start({
			width: '200px',
			color: '#C6D880'
		});
	});
	
	// Or we just use Element.morph
	$('CSSmorphEffect').addEvent('click', function(e) {
		e.stop();
		// Changes the element's style to .myClass defined in the CSS
		anotherEl.morph('.myClass');
	});
	
	$('resetEffect1').addEvent('click', function(e) {
		e.stop();
		// You need the same selector defined in the CSS-File
		anotherEl.morph('div.demoElement');
	});
	*/
});