Foros del Web » Programando para Internet » Javascript »

Imagen al pasar el mouse

Estas en el tema de Imagen al pasar el mouse en el foro de Javascript en Foros del Web. Buen día Necesito hacer una página web en la que tengo una lista con nombres de personas y me interesa que al pasar el mouse ...
  #1 (permalink)  
Antiguo 12/10/2005, 23:16
Avatar de gmaciel  
Fecha de Ingreso: marzo-2005
Mensajes: 391
Antigüedad: 19 años, 1 mes
Puntos: 4
Pregunta Imagen al pasar el mouse

Buen día

Necesito hacer una página web en la que tengo una lista con nombres de personas y me interesa que al pasar el mouse sobre el nombre, muestre una fotografía.

Si es complicado o no es posible que sea al pasar el mouse, que sea al dar un click.

Aclaro que sé muy poco de html, mucho menos de flash u otros programas similares, pero si entiendo algo sobre los códigos en html

Espero me puedan ayudar y muchas gracias de antemano.

GM
  #2 (permalink)  
Antiguo 12/10/2005, 23:36
Avatar de vpereyra  
Fecha de Ingreso: septiembre-2004
Ubicación: Lima, Peru
Mensajes: 374
Antigüedad: 19 años, 8 meses
Puntos: 0
hola, pues eso se hace con Javascript, puedes encontrar un ejemplo aca:
http://derroteros.perucultural.org.pe

como ves los botones cambian de apagado a prendido, al igual solo deberas cambiar el nombre (apagado) y la foto (prendido)

saludos
__________________
Victor Pereyra
  #3 (permalink)  
Antiguo 13/10/2005, 05:57
Avatar de ludovico2000  
Fecha de Ingreso: noviembre-2003
Ubicación: Bizkaia
Mensajes: 1.315
Antigüedad: 20 años, 5 meses
Puntos: 2
Yo creo que lo que buscas es más bien que salga algo "sobre" la página que estás viendo, no en su lugar...

Mira este código:

Código:
<html>
<body bgcolor="#FFFFFF">

<script language="JavaScript">
<!-- 
// Esta es la función que abrirá
// la nueva ventana cuando el ratón pase sobre el link
function open_new_window(foto) 
{

nueva_ventana = open("","","width=300,height=200,left=100,top=100");

// abre la nueva ventana 
nueva_ventana.document.open();

// Código de la nueva ventana
// Sustituye las " por ' o por \" o de lo contrario no funcionará
// Aquí puedes utilizar una variable para definir qué foto abrirá
nueva_ventana.document.write("<html><title>Tu foto: "+foto+"</title>");
nueva_ventana.document.write("<body bgcolor=\"#FFFFFF\">");
nueva_ventana.document.write("<img src=\""+foto+"\">");
nueva_ventana.document.write("</body></html>");
}

// Esta es la función que cerrará
// la nueva ventana cuando el ratón salga del link
function close_window() 
{
nueva_ventana.close();
}

// -->
</script>


<a href="#" onMouseOver="javascript:open_new_window('manuel')" onMouseOut="close_window()">Manuel Fernández</a>




</body>
</html>
Lo he obtenido de:

http://www.codeave.com/javascript/code.asp?u_log=7056

Buscando en google: "on mouseover pop up"

Lo he puesto en castellano.

Adicionalmente, he incluido una variable "foto" para no tener que hacer una función para cada uno, sino una global tipo funcion(foto) y luego llamarla onmouseover="funcion(manuel)"; onmouseover="funcion(perico)", etc.

También se puede hacer con capas, pero es más complicado -aunque el resultado sea más limpio-

Espero que te sirva
  #4 (permalink)  
Antiguo 13/10/2005, 06:03
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Tema trasladado al foro de javascript desde (x)html
  #5 (permalink)  
Antiguo 13/10/2005, 10:28
Avatar de ludovico2000  
Fecha de Ingreso: noviembre-2003
Ubicación: Bizkaia
Mensajes: 1.315
Antigüedad: 20 años, 5 meses
Puntos: 2
Con capas, puedes tirar por aqui:

http://www.forosdelweb.com/showpost....&postcount=190
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:45.