window.addEvent('domready', function(){
	
	// We are setting the opacity of the element to 1 and adding two events
	$('active1').set('opacity', 1).addEvents({
		mouseenter: function(){
			// This morphes the opacity
			this.morph({
				'opacity': 0.5,
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1,
			});
		}
	});
	$('active2').set('opacity', 1).addEvents({
		mouseenter: function(){
			// This morphes the opacity
			this.morph({
				'opacity': 0.5,
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1,
			});
		}
	});
	$('active3').set('opacity', 1).addEvents({
		mouseenter: function(){
			// This morphes the opacity
			this.morph({
				'opacity': 0.5,
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1,
			});
		}
	});
	$('active4').set('opacity', 1).addEvents({
		mouseenter: function(){
			// This morphes the opacity
			this.morph({
				'opacity': 0.5,
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1,
			});
		}
	});
	$('active5').set('opacity', 1).addEvents({
		mouseenter: function(){
			// This morphes the opacity
			this.morph({
				'opacity': 0.5,
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1,
			});
		}
	});
	$('active6').set('opacity', 1).addEvents({
		mouseenter: function(){
			// This morphes the opacity
			this.morph({
				'opacity': 0.5,
			});
		},
		mouseleave: function(){
			// Morphes back to the original style
			this.morph({
				opacity: 1,
			});
		}
	});
});