window.addEvent('domready', function(){									 

/*
	var e1 = $('myOtherElement1'), color = e1.getStyle('backgroundColor');
	var e2 = $('myOtherElement2'), color = e2.getStyle('backgroundColor');
	var e3 = $('myOtherElement3'), color = e3.getStyle('backgroundColor');
*/

	// Second Example	
	// The same as before: adding events
	$('menu1').set('opacity', 1) .addEvents( {'mouseenter': function(){
			// Always sets the duration of the tween to 1000 ms and a bouncing transition
			// And then tweens the height of the element
			$('myOtherElement1')
				.set('tween', { duration: 500 })
				.tween('height', '38px');
			
			$('myOtherElement1')
				.morph({'opacity': 1,'background-color': '#F6C33B'});
			//$('myOtherElement1').style.background='#FF0000';
		},
		'mouseleave': function(){
			// Resets the tween and changes the element back to its original size
			$('myOtherElement1')
				.set('tween', {})
				.tween('height', '0px');}
	});
	
		$('menu1').set('opacity', 1) .addEvents( {'mouseenter': function(){
			$('myOtherElement1-2')
				.set('tween', {	duration: 500 })
				.tween('height', '38px');
			
			$('myOtherElement1-2')
				.morph({ 'opacity': 1, 'background-color': '#F6C33B'});
			},
		'mouseleave': function(){
			$('myOtherElement1-2')
				.set('tween', {})
				.tween('height', '0px');}
	});



	$('menu3').set('opacity', 1) .addEvents( {'mouseenter': function(){
			$('myOtherElement3')
				.set('tween', { duration: 500 })
				.tween('height', '38px');
			
			$('myOtherElement3')
				.morph({ 'opacity': 1, 'background-color': '#EB2C00'});
		},
		'mouseleave': function(){
			$('myOtherElement3')
				.set('tween', {})
				.tween('height', '0px');}
	});
	




	$('menu4').set('opacity', 1) .addEvents( {'mouseenter': function(){
			$('myOtherElement4')
				.set('tween', { duration: 500 })
				.tween('height', '86px');
			
			$('myOtherElement4')
				.morph({ 'opacity': 1, 'background-color': '#c9d49a'});
		},
		'mouseleave': function(){
			$('myOtherElement4')
				.set('tween', {})
				.tween('height', '0px');}
	});
	
	
		$('menu6').set('opacity', 1) .addEvents( {'mouseenter': function(){
			$('myOtherElement6')
				.set('tween', { duration: 500 })
				.tween('height', '38px');
			
			$('myOtherElement6')
				.morph({ 'opacity': 1, 'background-color': '#91cbba'});
		},
		'mouseleave': function(){
			$('myOtherElement6')
				.set('tween', {})
				.tween('height', '0px');}
	});
	
});