Privacidad: Recuerde que la información escrita en los foros de programación es 100% pública y que su ip será registrada asociada a su mensaje. Si encuentra un mensaje fuera de lugar, por favor, notifiquelo para su revisión y eliminación.
comportamientos imagenes de menu
Enviado por Tricky22 el día 21 de febrero de 2006
Hola!!q tal?!Vereis... estoy haciendo un menú horizontal. Cada opcion del menú no es texto sino una imagen.
...<td> <a href="#" onClick="ShowHide ('Layer1','','show')"><img src="C:\imagenes\atcliente.jpg" name="A"></a></td> ....
El caso es que quiero que cuando el ratón este por encima o fuera de una opción se muestre diferente en cada caso. Con texto lo se hacer pero con imágenes no. Que tipo de comportamientos puedo poner?y como?
¿Tendría que crearme varias copias(ligeramente diferentes) de una misma imagen para simular un comportamiento??si es así, como se hace??
Espero haberme explicado bien, muchas gracias!un saludo,
Tricky
Buenas tardes, en mi caso, para simular iconos que se pulsan al situar el cursor encima uso lo siguiente:
Funciones, en un .js por ejemplo:
/*Función que permite buscar la imagen ON de los iconos*/
function OnImage(name) {
if (document.images) {
fullname = eval(name + \\\"2\\\");
document[name].src = fullname.src;
}
}
/*Función que permite buscar la imagen OFF de los iconos*/
function OffImage(name) {
if (document.images) {
fullname = eval(name);
if (fullname.complete)
{
document[name].src = fullname.src;
}
}
}
Despues dentro de mi página en el HEAD
<SCRIPT LANGUAGE=\\\"JavaScript\\\">
if (document.images)
{
ayuda = new Image();
ayuda.src = \\\"../htdocs/imagenes/IcoAyuda.gif\\\";
ayuda2 = new Image();
ayuda2.src = \\\"../htdocs/imagenes/IcoAyudaON.gif\\\";
salir = new Image();
salir.src = \\\"../htdocs/imagenes/IcoSalir.gif\\\";
salir2 = new Image();
salir2.src = \\\"../htdocs/imagenes/IcoSalirON.gif\\\";
consulta = new Image();
consulta.src = \\\"../htdocs/imagenes/IcoConsulta.gif\\\";
consulta2 = new Image();
consulta2.src = \\\"../htdocs/imagenes/IcoConsultaON.gif\\\";
}
</SCRIPT>
Y por fin en el body, para cada una de las imagenes: