Foros del Web » Creando para Internet » HTML »

Link que al pasar por encima deja ver una imagen

Estas en el tema de Link que al pasar por encima deja ver una imagen en el foro de HTML en Foros del Web. Estimado amigos: Estoy haciendo una página donde aparecen bastantes fotos ligadas a nombres, quiero que según posicionemos el ratón encima del link correspondiente a la ...
  #1 (permalink)  
Antiguo 02/05/2002, 18:54
 
Fecha de Ingreso: junio-2001
Mensajes: 13
Antigüedad: 16 años, 5 meses
Puntos: 0
Link que al pasar por encima deja ver una imagen

Estimado amigos:
Estoy haciendo una página donde aparecen bastantes fotos ligadas a nombres, quiero que según posicionemos el ratón encima del link correspondiente a la imagen esta aparezca en un espacio predefinido de la pantalla.

¿Teneis algún código?
Gracias
  #2 (permalink)  
Antiguo 02/05/2002, 21:38
 
Fecha de Ingreso: noviembre-2001
Mensajes: 76
Antigüedad: 16 años
Puntos: 0
Re: Link que al pasar por encima deja ver una imagen

en el link colocas una onmouseover="nombre_de_tu_función()"

y previamente habrás definido el script de nombre_de_tu_función() con la carga en una parte de la pantalla de la imagen.
  #3 (permalink)  
Antiguo 03/05/2002, 11:49
Usuario no validado
 
Fecha de Ingreso: mayo-2002
Mensajes: 13
Antigüedad: 15 años, 7 meses
Puntos: 0
Re: Link que al pasar por encima deja ver una imagen

Hola,me lo puedes explicar mejor?por ejemplo,una foto de una rosa,dónde se pone ese link
  #4 (permalink)  
Antiguo 03/05/2002, 14:21
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Re: Link que al pasar por encima deja ver una imagen

Hola luanga:

Espero que lo que quieres sea algo así:

El sitio donde quieres que se vea el nombre, puede ser cualquier etiqueta, voy a poner un div en el ejemplo:

<div id=nombre></div>

Como puedes ver, dentro del div no hay nada, pero es donde tiene que aparecer el nombre.

Si quieres que sirva solo en explorer, puedes referenciarlo con nombre.innerHTML="pepito" (este ejemplo solo es válido con pepito); pero para que sirva también para Navigator (la versión 6 o superior de ambos -no lo sé en otras versiones) se referencia con document.getElementById("nombre").innerH TML="pepito"...

Entonces en el fichero de pepito tienes que poner algo así:

<img src="juanito.jpg" onmouseover="document.getElementById('nombre' ).innerHTML='pepito'" >

Para borrarlo tienes que poner la cadena vacía en "onmouseout".

Espero que te sirva.
  #5 (permalink)  
Antiguo 03/05/2002, 19:50
 
Fecha de Ingreso: junio-2001
Mensajes: 13
Antigüedad: 16 años, 5 meses
Puntos: 0
Re: Link que al pasar por encima deja ver una imagen

Muchas gracias por las contestaciones. Veo que no me he expresado con total claridad. Os pido perdón. :(

Vereis, estoy haciendo una página para una empresa que tiene un amplio catálogo de fotografías y en una de las páginas quiero que estén los nombres de los productos (ligados a las fotos). En la misma página, quiero, que al pasar con el ratón por encima de cada nombre de producto aparezca en una sección de la misma página la foto del producto en la cual se encuentra el ratón posicionado.

De nuevo gracias
  #6 (permalink)  
Antiguo 04/05/2002, 04:45
Avatar de KarlanKas
Moderador extraterrestre
 
Fecha de Ingreso: diciembre-2001
Ubicación: Madrid
Mensajes: 6.987
Antigüedad: 16 años
Puntos: 60
Re: Link que al pasar por encima deja ver una imagen

Hola Luanga!!

Dime si es esto lo que quieres:
------------------
<html>
<head>
<title>Prueba</title>
<script>
function cambia(archivo,explicacion){
foto.src=archivo;
descripcion.innerHTML=explicacion;
}
function quitar(){
foto.src='logo.jpg';
descripcion.innerHTML='pulse el producto deseado';}
</script>
</head>

<body>
<div style="position:absolute;top:50px;left:50px;w idth:250px;text-align:center;">
<img id="foto" src="logo.jpg" height="100" width="100" border="0"><br>
<p id="descripcion">pulse el producto deseado</p>
</div>

<table style="position:absolute; top:100;right:10px;border:none;">
<tr>

<td> <a href="#" onmouseover="cambia('foto1.jpg','Es un articulo muy bonito')" onmouseout="quitar()">foto 1</a></td>
</tr>
<tr>

<td> <a href="#" onmouseover="cambia('foto2.jpg','En color rojo')" onmouseout="quitar()">foto 2</a></td>
</tr>
<tr>

<td> <a href="#" onmouseover="cambia('foto3.jpg','Sirve para todo')" onmouseout="quitar()">foto 3</a></td>
</tr>
</table>


</body>
</html>
-----------------------

Salu2


<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="190" height="51"><param name="bgcolor" value="#0066CC"><param name="movie" value="http://www.webareyou.com/Movie1.swf"><embed src="http://www.webareyou.com/Movie1.swf"></embebed></object>
  #7 (permalink)  
Antiguo 07/05/2002, 16:41
 
Fecha de Ingreso: junio-2001
Mensajes: 13
Antigüedad: 16 años, 5 meses
Puntos: 0
Re: Link que al pasar por encima deja ver una imagen

Estimado karlankas:

En fecto es lo que pretendía pero no me carg las imagenes que referencio desde el directorio de ubicación.

Muchas gracias por el apoyo, voy a analizar el código, para hacerlo funcionar.

Recibe un cordial saludo
  #8 (permalink)  
Antiguo 10/05/2002, 07:07
Avatar de KarlanKas
Moderador extraterrestre
 
Fecha de Ingreso: diciembre-2001
Ubicación: Madrid
Mensajes: 6.987
Antigüedad: 16 años
Puntos: 60
Re: Link que al pasar por encima deja ver una imagen

Luanga!

Perdona que no te contestara antes, pero es que no me acordaba de este &quot;Post&quot;

no entiendo porque no te funciona! deberías poner si está en un subdirectorio lo siguiente:
----------------
&lt;td&gt; &lt;a href=&quot;#&quot; onmouseover=&quot;cambia('subdirectorio/ foto3.jpg','Sirve para todo')&quot; onmouseout=&quot;quitar()&quot;&gt;foto 3&lt;/a&gt;&lt;/td&gt;
----------------

Espero que te funcione!!

Si están todas las imágenes en el mismo subdirectorio podrías cambiar, en vez de lo de arriba, lo siguiente:
--------------------
function cambia(archivo,explicacion){
foto.src='directorio/'+ archivo;
descripcion.innerHTML=explicacion;
}
--------------

Recibe un saludo!!

KarlanKas
  #9 (permalink)  
Antiguo 17/05/2002, 08:37
 
Fecha de Ingreso: junio-2001
Mensajes: 13
Antigüedad: 16 años, 5 meses
Puntos: 0
Re: Link que al pasar por encima deja ver una imagen

KarlanKas, muchas gracias por tu preocupación. Como te decía en el mensaje anterior ya me funciona, lo cual te agradezco mucho.

No te preocupes por la tardía contestación, pues como te digo ya lo conseguí hacer funcionar.

Muchas gracias y un saludo KarlanKas.
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 11:34.