Texto al pasar por imagen
¿Que puedo hacer para que al pasar por encima de diferentes imagenes salga un texto diferente en un lugar que yo quiera? Es decir, que al pasar por encima de una imagen ponga INICIO, al pasar por encima de otra FOTOS, etc, y todo el texto en el mismo lugar.
Si alguien me puede ayudar se lo agradezco.
Si alguien me puede ayudar se lo agradezco.
pon alt="texto que quiero" en cada una de las imagenes. Ejemplo:
<img src="palo.jpg" alt="esto es un palo">
<img src="palo.jpg" alt="esto es un palo">
LO puedes hacer con capas y aplicando eventos.
Donde quieres que te aparezca el texto pones tantas capas como textos kieras que aparezcan al pasar por las diferentes imagenes y luego por ejemplo le das a la imagen uno, y pones en evento mostrar ocultar capa le pones ocultos a todas las capas de texto que no sean la correspondiente a esa imagen. pones en el evento en mouse over, y luego haces un mismo evento pero haciendo lo contrario es decir para que al quitar el raton de la imagen este texto desaparezca y le pones on mouse out. no es dificil pero si tienes muchas imagenes y muchos textos es un poco rollo, espero haberte ayudado
Donde quieres que te aparezca el texto pones tantas capas como textos kieras que aparezcan al pasar por las diferentes imagenes y luego por ejemplo le das a la imagen uno, y pones en evento mostrar ocultar capa le pones ocultos a todas las capas de texto que no sean la correspondiente a esa imagen. pones en el evento en mouse over, y luego haces un mismo evento pero haciendo lo contrario es decir para que al quitar el raton de la imagen este texto desaparezca y le pones on mouse out. no es dificil pero si tienes muchas imagenes y muchos textos es un poco rollo, espero haberte ayudado
Yo esto no lo controlo mucho, si pudieses ponerme el codigo html y esas cosas... te lo agradeceria bastante.
De todas formas, gracias por esto.
Un saludo.
De todas formas, gracias por esto.
Un saludo.
Mira si te vale esto:
<html>
<head>
<title>MouseOver</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
function changeText(_text){
document.getElementById('LyTexto').innerHTML=('<div align=center><font size=2 color="blue">'+_text+'</font></div>')
}
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<img src="file:///C|/Cartoteca/Images/0.gif" width="20" height="15" onmouseover="changeText('INICIO')">
<img src="file:///C|/Cartoteca/Images/1.gif" width="20" height="15" onmouseover="changeText('FOTOS')">
<img src="file:///C|/Cartoteca/Images/2.gif" width="20" height="15" onmouseover="changeText('OTRA COSA')">
<img src="file:///C|/Cartoteca/Images/3.gif" width="20" height="15" onmouseover="changeText('LO QUE QUIERAS')">
<div id="LyTexto" style="position:absolute; left:47px; top:52px; width:116px; height:20px; z-index:1 ; background-color: #99aacc; layer-background-color: #99aacc; border-style:solid;border-width:1;border-color:336699"></div>
</body>
</html>
Suerte
rsalvadores
<html>
<head>
<title>MouseOver</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
function changeText(_text){
document.getElementById('LyTexto').innerHTML=('<div align=center><font size=2 color="blue">'+_text+'</font></div>')
}
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<img src="file:///C|/Cartoteca/Images/0.gif" width="20" height="15" onmouseover="changeText('INICIO')">
<img src="file:///C|/Cartoteca/Images/1.gif" width="20" height="15" onmouseover="changeText('FOTOS')">
<img src="file:///C|/Cartoteca/Images/2.gif" width="20" height="15" onmouseover="changeText('OTRA COSA')">
<img src="file:///C|/Cartoteca/Images/3.gif" width="20" height="15" onmouseover="changeText('LO QUE QUIERAS')">
<div id="LyTexto" style="position:absolute; left:47px; top:52px; width:116px; height:20px; z-index:1 ; background-color: #99aacc; layer-background-color: #99aacc; border-style:solid;border-width:1;border-color:336699"></div>
</body>
</html>
Suerte
rsalvadores
