var state = 'hidden';

function showHide(layer_ref) 
{
	if (state == 'visible') {
	state = 'hidden';
	}
	else {
	state = 'visible';
	}
	if (document.all) { //IS IE 4 or 5 (or 6 beta)
	eval( "document.all." + layer_ref + ".style.visibility = state");
	}
	if (document.layers) { //IS NETSCAPE 4 or below
	document.layers[layer_ref].visibility = state;
	}
	if (document.getElementById && !document.all) {
	maxwell_smart = document.getElementById(layer_ref);
	maxwell_smart.style.visibility = state;
	}
}

var activeImage;

window.addEvent('domready', function()
{	
	//set the default image
	activeImage = 'p_img1';
	
	//initialise the default image
	var initialise = $(activeImage).setStyles({display:'block',opacity: 0});	
	new Fx.Tween(initialise, {duration: 1}).set('opacity', 1);
	
	//event listener
	var menuElements = $('divMarcoTarjeta').getElements('a');
	
	for (var i=0; i<menuElements.length; i++) {
		if (menuElements[i].id.match("^img")=="img") {
			menuElements[i].addEvent('mouseenter', function(e) 
			{	
				new Event(e).stop();
				var newImage = "p_" + this.id;
				transitionImage(activeImage,newImage);
			});
		}
	}
});

function transitionImage(oldImage,newImage)
{
	var fadeOut = function()
	{
		var div = $(oldImage).setStyles({
			opacity: 1
		});
		
		new Fx.Tween(div, {duration: 350}).start('opacity',0);
		
		fadeIn();	
	};
	
	var fadeIn = function()
	{
		var div2 = $(newImage).setStyles({
			display:'block',
			opacity: 0
		});
			
		new Fx.Tween(div2, {duration: 350}).start('opacity',1);
		activeImage = newImage;	
	};
	
	if(newImage != activeImage)
	{
		fadeOut();	
	}
}

function morphDiv(divId, w, h, autoHide) {
	var div = document.getElementById(divId);
	if (w != div.style.width || h != div.style.height) {
		new Fx.Morph(div).start({'height': [div.style.height, h], 'width': [div.style.width, w]});
		if (autoHide) setTimeout("morphDiv('"+divId+"', 0, 0, false);", 6500);
	}
}