cambiar tamaño imagen con onmouseover

Foro de elhacker.net

Programación

Desarrollo Web (Moderador: #!drvy)

cambiar tamaño imagen con onmouseover

0 Usuarios y 1 Visitante están viendo este tema.

Páginas: [1]

Autor

Tema: cambiar tamaño imagen con onmouseover (Leído 5,503 veces)

viher

Desconectado

Mensajes: 113

cambiar tamaño imagen con onmouseover

« en: 7 Septiembre 2010, 16:00 pm »

hola,yo tengo el siguiente código con mouseover

Código

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<SCRIPT LANGUAGE="javascript">
<!-- Begin
loadImage1 = new Image();
loadImage1.src = "http://img100.xvideos.com/videos/thumbs/0/8/7/0870cc6a3cd66f55c48e8cf241c4c268.2.jpg";
staticImage1 = new Image();
staticImage1.src = "http://img100.xvideos.com/videos/thumbs/0/8/7/0870cc6a3cd66f55c48e8cf241c4c268.1.jpg";
// End -->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
</head>
 
<body>
<a href="http://img100.xvideos.com/videos/thumbs/0/8/7/0870cc6a3cd66f55c48e8cf241c4c268.3.jpg" onmouseover="image1.src=loadImage1.src;" onmouseout="image1.src=staticImage1.src;">
<img name="image1" src="http://img100.xvideos.com/videos/thumbs/0/8/7/0870cc6a3cd66f55c48e8cf241c4c268.1.jpg" border=0></a>
</body>
</html>

el caso es que querria que cuando pase el raton por encima la imagen que está puesta se pusiera por ejemplo la propiedad height="100%" y width="100%" pero he estado probando y no lo consigo,he hecho lo siguiente:

Código

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<SCRIPT LANGUAGE="javascript">
<!-- Begin
loadImage1 = new Image();
loadImage1.src = "http://img100.xvideos.com/videos/thumbs/0/8/7/0870cc6a3cd66f55c48e8cf241c4c268.2.jpg";
staticImage1 = new Image();
staticImage1.src = "http://img100.xvideos.com/videos/thumbs/0/8/7/0870cc6a3cd66f55c48e8cf241c4c268.1.jpg";
// End -->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
</head>
 
<body>
<a href="http://img100.xvideos.com/videos/thumbs/0/8/7/0870cc6a3cd66f55c48e8cf241c4c268.3.jpg" onmouseover="image1.src=loadImage1.src; image1.width=100%;" onmouseout="image1.src=staticImage1.src;">
<img name="image1" src="http://img100.xvideos.com/videos/thumbs/0/8/7/0870cc6a3cd66f55c48e8cf241c4c268.1.jpg" border=0></a>
</body>
</html>

como seria? gracias


« Última modificación: 7 Septiembre 2010, 20:32 pm por viher »	En línea

Sombeo - El mejor humor de Internet recogido en una sóla página web.

Franki

Desconectado

Mensajes: 46

Re: cambiar tamaño imagen con onmouseover

« Respuesta #1 en: 8 Septiembre 2010, 00:32 am »

Código

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<SCRIPT LANGUAGE="javascript">
<!-- Begin
loadImage1 = new Image();
loadImage1.src = "http://img100.xvideos.com/videos/thumbs/0/8/7/0870cc6a3cd66f55c48e8cf241c4c268.2.jpg";
staticImage1 = new Image();
staticImage1.src = "http://img100.xvideos.com/videos/thumbs/0/8/7/0870cc6a3cd66f55c48e8cf241c4c268.1.jpg";
// End -->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
</head>
 
<body>
<a href="http://img100.xvideos.com/videos/thumbs/0/8/7/0870cc6a3cd66f55c48e8cf241c4c268.3.jpg" onmouseover="image1.src=loadImage1.src; image1.style.width='100%';" onmouseout="image1.src=staticImage1.src;">
<img name="image1" src="http://img100.xvideos.com/videos/thumbs/0/8/7/0870cc6a3cd66f55c48e8cf241c4c268.1.jpg" border=0></a>
</body>
</html>

No puedes acceder directamente al atributo width a partir de la imagen. A partir de la imagen puedes acceder al atributo style, y a partir de ese atributo al atributo width. Luego tienes que comentar entre comillas simples el valor del atributo width porque es una cadena de texto.

Eso son los cambios para que funcionen. Revisa el código que te he puesto.

Bonita imagen xD.


	En línea

http://parasitovirtual.wordpress.com/

viher

Desconectado

Mensajes: 113

Re: cambiar tamaño imagen con onmouseover

« Respuesta #2 en: 8 Septiembre 2010, 02:19 am »

muchas gracias Franki ;-)


	En línea

Sombeo - El mejor humor de Internet recogido en una sóla página web.

:ohk<any>

Desconectado

Mensajes: 1.744

Yo lo que quiero que me salga bien es la vida.

Re: cambiar tamaño imagen con onmouseover

« Respuesta #3 en: 9 Septiembre 2010, 14:11 pm »

Cita de: Franki en 8 Septiembre 2010, 00:32 am

Bonita imagen xD.


	En línea

Y es que a veces pienso que si no estuviera loco no podría salir adelante.
Lo que no se es capaz de dar, en realidad no se posee, uno es poseído por ello.

Páginas: [1]

Ir a:

Mensajes similares
	Asunto	Iniciado por	Respuestas	Vistas	Último mensaje
	Cambiar contenido de OnMouseOver y Out desde un Array Desarrollo Web	Cannabinnol	4	3,278	1 Febrero 2013, 23:08 pm por Cannabinnol
	[Resuelto] (javascript) Onmouseover ocurre con los elementos hijos Desarrollo Web	Seyro97	1	1,823	5 Abril 2015, 18:20 pm por Seyro97
	[Resuelto] Cambiar el tamaño de una imagen alojada en otro servidor Desarrollo Web	user-marcos	5	3,707	11 Enero 2016, 23:35 pm por Ume
	Subir imagen y cambiar tamaño PHP	gabrielbdmr	0	2,118	2 Diciembre 2016, 02:10 am por gabrielbdmr
	Cambiar el tamaño de imagen dinamicamente Desarrollo Web	FGM24	4	11,122	5 Noviembre 2021, 02:54 am por FGM24