Sv Community El Salvador
Soporte y Tecnología => Diseño & Webmaster Corner => Mensaje iniciado por: froilan en marzo 17, 2007, 06:53:06 pm
-
nesecito saber el script de java para que una imagen cambie a otra cuando el puntero este sobre y al quitarlo buelva a la imagen anterior
lo he hecho como me lo piden pero no se por que no funciona de antemano gracias
pd:el nombre de las dos imagenes es logo1 y logo23
<script>
imagen1 = new Image;
imagen1.src == "logo1.jpg";
imagen2 = new Image;
imagen2.src="logo23.jpg";
funcion cambioimagen(tipo){
if(tipo=="sobre"){
document.getElementById("imagensuperior").src= imagen2.src;
} else {
document.getelementById("imagensuperior").src= imagen1.src;
}
}
</script>
<html>
<head>
<title>Documento sin título</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<table width="835" height="132" border="1">
<tr>
<td width="327" rowspan="3"> </td>
<td width="232" rowspan="3"> </td>
<td width="254"><img src="logo1.jpg" name="imagensuperior" width="107" height="107" id= "imagensuperior" onMouseOver="cambioimagen('sobre');"
onMouseOut="cambioimagen('fuera')"></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
</td>
</tr>
</table>
</body>
</html>
-
Sip, mira el codigo para cambiar la imagen esta bien. Lo que sucede es que las imágenes no aceptan el atributo "onmouseover" tenes que meter la imagen dentro de un link.
Aquí te va otra forma de hacerlo:
....header...
<script type="text/javascript">
<!--
function changeImages(container,source) {
document.getElementById(container).setAttribute("src",source);
}
//-->
</script>
.... body....
<a onmouseover="changeImages('logo1','logo23.jpg');return true"
onclick="return false;"
onmouseout="changeImages('logo1','logo1.jpg');return true" href="">
<img id="logo1" src="logo1.jpg" alt="" name="llogo1" height="85" width="20" border="0">
</a>
Con onmouseover llamas a la funcion changeImages(<nombreimagen>,<rutadelaimagen>) y cuando encuentra onmouseout llama de nuevo a la funcion con la imagen original.
Fijate el detalle que la imagen no va sola sino que adentro de una etiqueta <a> ya que esta es la que recibe los eventos de onmouseover y onmouseout... el onclick="return false;" es para evitar que se te recargue la ventana al hacer click.
-
Con dreamweaver lo podés hacer man.
Insertas la imagen que aparecerá, después seleccionas esa imagen y vas a:
Insertar > Objetos de Imagen > Imágen de Sustitución.
-
Ya corregí el código, no lo habia modificado bien jejeje pero ahora si te debería funcionar.
El Dreamweaver no me gusta que te agrega mucho codigo basura.. bueno cualquier editor... a veces es mejor hacerlo a mano para que quede bien optimizadito.
-
hey gracias a los 2 man me han sacado de aguas ahora a matarme haciendo un reloj pero me funciono el de los dos muchas gracias