/*************************************************************************/
/*                    ANINAMACIÓN DE IMÁGENES                    		       */
/*																		 */
/*	Este Script es de uso libre y gratuito para aplicaciones			 */
/*    sin ánimo de lucro. En caso contrario dirigirse a		 		 */
/*																		 */
/*	       		malva@guiasdemadrid.org								 */
/*************************************************************************/

// Comenzamos el Script precargando las imágenes para que tarden menos
// en ejecutarse las funciones

  if (document.images) {

	// La primera imagen, con sufijo "on", es la que se desea 
	// visualizar cuando se ejecute onMouseOver, es decir, cuando 
	// se pase por encima de la imagen que vamos a cambiar

    img00on01 = new Image();   img00on01.src = "img/menu0001.gif";
    img00on02 = new Image();   img00on02.src = "img/menu0002.gif";
    img00on03 = new Image();   img00on03.src = "img/menu0003.gif";
    img00on04 = new Image();   img00on04.src = "img/menu0004.gif";

	// La segunda imagen, con sufijo "off", es la que se desea
	// visualizar como predeterminada y cuando se deja de enfocar
	// con el ratón, es decir, en onMouseOut

    img00off = new Image();   img00off.src = "img/menu00.gif";

	// Esto se debe repetir para todas las imágenes que queramos 
	// animar.
	// Se pueden elegir más imágenes para otrs eventos, como onFocus, 
	// etc. Para ello hay que añadir las funciones oportunas, similares
	// a las siguientes.

    img01on01 = new Image();   img01on01.src = "img/menu0101.gif";
    img01on02 = new Image();   img01on02.src = "img/menu0102.gif";
    img01on03 = new Image();   img01on03.src = "img/menu0103.gif";
    img01on04 = new Image();   img01on04.src = "img/menu0104.gif";
    img01off = new Image();   img01off.src = "img/menu01.gif";

    img0101on01 = new Image();   img0101on01.src = "../img/menu0101.gif";
    img0101on02 = new Image();   img0101on02.src = "../img/menu0102.gif";
    img0101on03 = new Image();   img0101on03.src = "../img/menu0103.gif";
    img0101on04 = new Image();   img0101on04.src = "../img/menu0104.gif";
    img0101off = new Image();   img0101off.src = "../img/menu01.gif";




    img02on01 = new Image();   img02on01.src = "img/menu0201.gif";
    img02on02 = new Image();   img02on02.src = "img/menu0202.gif";
    img02on03 = new Image();   img02on03.src = "img/menu0203.gif";
    img02on04 = new Image();   img02on04.src = "img/menu0204.gif";
    img02off = new Image();   img02off.src = "img/menu02.gif";

    img0201on01 = new Image();   img0201on01.src = "../img/menu0201.gif";
    img0201on02 = new Image();   img0201on02.src = "../img/menu0202.gif";
    img0201on03 = new Image();   img0201on03.src = "../img/menu0203.gif";
    img0201on04 = new Image();   img0201on04.src = "../img/menu0204.gif";
    img0201off = new Image();   img0201off.src = "../img/menu02.gif";




    img03on01 = new Image();   img03on01.src = "img/menu0301.gif";
    img03on02 = new Image();   img03on02.src = "img/menu0302.gif";
    img03on03 = new Image();   img03on03.src = "img/menu0303.gif";
    img03on04 = new Image();   img03on04.src = "img/menu0304.gif";
    img03off = new Image();   img03off.src = "img/menu03.gif";

    img0301on01 = new Image();   img0301on01.src = "../img/menu0301.gif";
    img0301on02 = new Image();   img0301on02.src = "../img/menu0302.gif";
    img0301on03 = new Image();   img0301on03.src = "../img/menu0303.gif";
    img0301on04 = new Image();   img0301on04.src = "../img/menu0304.gif";
    img0301off = new Image();   img0301off.src = "../img/menu03.gif";

    img04on01 = new Image();   img04on01.src = "img/menu0401.gif";
    img04on02 = new Image();   img04on02.src = "img/menu0402.gif";
    img04on03 = new Image();   img04on03.src = "img/menu0403.gif";
    img04on04 = new Image();   img04on04.src = "img/menu0404.gif";
    img04off = new Image();   img04off.src = "img/menu04.gif";

    img0401on01 = new Image();   img0401on01.src = "../img/menu0401.gif";
    img0401on02 = new Image();   img0401on02.src = "../img/menu0402.gif";
    img0401on03 = new Image();   img0401on03.src = "../img/menu0403.gif";
    img0401on04 = new Image();   img0401on04.src = "../img/menu0404.gif";
    img0401off = new Image();   img0401off.src = "../img/menu04.gif";
  }

/**** Función de cambio a la imagen en on1 ******************************/

function imgOn01(imgName) {
  if (document.images) {
    document[imgName].src = eval(imgName + "on01.src");
  }
}

/**** Función de cambio a la imagen en off ******************************/

function imgOff(imgName) {
  if (document.images) {
    document[imgName].src = eval(imgName + "off.src");
  }
}

/**** Función de cambio a la imagen en on2 ******************************/

function imgOn02(imgName) {
  if (document.images) {
    document[imgName].src = eval(imgName + "on02.src");
  }
}


/**** Función de cambio a la imagen en on3 ******************************/

function imgOn03(imgName) {
  if (document.images) {
    document[imgName].src = eval(imgName + "on03.src");
  }
}

/**** Función de cambio a la imagen en on4 ******************************/

function imgOn04(imgName) {
  if (document.images) {
    document[imgName].src = eval(imgName + "on04.src");
  }
}

/**** Fin del script ****************************************************/

/************************************************************************/
/* En el código HTML hay que introducir lo siguiente:			*/
/* 									*/
/* <A HREF="direccion" onMouseOver="imgOn('img01'); return true" 	*/
/* onMouseOut="imgOff('img01')">					*/
/* <img SRC="img/fondo0102.gif" NAME="img01">				*/
/* </A>									*/
/*									*/
/* Donde "dirección" es la del enlace al que apunta la imagen           */
/* Y de forma equivalente con todas las imágenes			*/
/************************************************************************/