/*
 * Effects for the Areashow at homepage
 */
window.addEvent('domready', function() {
	
	var list = $$('#areaShow .singleArea');
	
	list.each(function(element) {
		
		var elHead = element.getFirst();
		var elImg = element.getLast();
		
		var headStartAlpha = elHead.getStyle('opacity');
		var imgStartAlpha = elImg.getStyle('opacity');
		//alert(headStartAlpha);
		//alert(imgStartAlpha);
	
		elHead.setStyle('opacity', 0.001);
		elImg.setStyle('opacity', 0.4);

		element.fxHead = new Fx.Styles(elHead, {duration:600, wait:false});
		element.fxImg = new Fx.Styles(elImg, {duration:600, wait:false});
		
		element.addEvent('mouseenter', function(){			
			element.fxImg.start({
				'opacity': 1
			});
			element.fxHead.start({
				'opacity': 1
			});
		});
		
		element.addEvent('mouseleave', function(){
			element.fxImg.start({
				'opacity': 0.4
			});
			element.fxHead.start({
				'opacity': 0.001
			});
			
		});
    });
});