onmouseover en sub elemento

[ch3ssmaster]

Hola estoy reemplazando una imagen con el evento onmouseover, aplicado directamente sobre la imagen, lo que ocurre es que en realidad necesitaría que la imagen cambiara la ruta al sobrevolar el enlace que la encierra pero no se suficiente javascript para hacer esto.

el codigo es similar a esto:

Código:

<a><img src="ruta/img.jpg" onmouseover="this.src='ruta/otra_img.jpg'"
 onmouseout="this.src='ruta/img.jpg'" /></a>

y mi intención es que la ruta de la imagen pudiera cambiarse con onmouseover desde el enlace. Por cierto, soluciones css en este caso no son viables.

[emprear]

No hay conflicto en lo que planteás

<a href="http://emprear.com"><img src="a.jpg" onmouseover="this.src='b.jpg'" onmouseout="this.src='c.jpg'" width="100" height="100" /></a>

el enlace va a seguir funcionando como tal, y las substituciones van a hacerse.
Además en tanto la imagen esté contenida en el enlace van a comportarse como una unidad, diferente sería la historia si estuviese fuera del mismo.


SAludos

[furoya]

Mucha limitación, ch3ssmaster. Pero quiero suponer que no es capricho.

Aprovecho para dar otra interpretación (porque tu mensaje no es nada claro en sus sobrevuelos) a la que puso emprear : que al pasar el puntero sobre el enlace se cambie la imagen, porque quieres los eventos en el enlace.

Ahí la pregunta tiene más sentido, porque no cualquier novato sabe cómo apuntar el elemento hijo.

Código:

<a href="javascript:void()" 
onmouseover="this.firstChild.src='http://img23.imageshack.us/img23/3299/chemendietapedroechage1.jpg'"  
onmouseout="this.firstChild.src='http://img840.imageshack.us/img840/6296/chemendietapedroechage2.jpg'" ><img height=320 
src="http://img840.imageshack.us/img840/6296/chemendietapedroechage2.jpg" /></a>

[Dradi7]

Iniciado por furoya

Mucha limitación, ch3ssmaster. Pero quiero suponer que no es capricho.

Aprovecho para dar otra interpretación (porque tu mensaje no es nada claro en sus sobrevuelos) a la que puso emprear : que al pasar el puntero sobre el enlace se cambie la imagen, porque quieres los eventos en el enlace.

Ahí la pregunta tiene más sentido, porque no cualquier novato sabe cómo apuntar el elemento hijo.

Código:

<a href="javascript:void()" 
onmouseover="this.firstChild.src='http://img23.imageshack.us/img23/3299/chemendietapedroechage1.jpg'"  
onmouseout="this.firstChild.src='http://img840.imageshack.us/img840/6296/chemendietapedroechage2.jpg'" ><img height=320 
src="http://img840.imageshack.us/img840/6296/chemendietapedroechage2.jpg" /></a>

Solo aclara que el código que has puesto esta todo bien pero solo funcionara siempre en cuando el primer elemento dentro del link sea la imagen, y otro es que no es recomendable trabajar con los eventos dentro del html pero ojo por metodo didactico es recomendable su uso

[furoya]

Sí, es cierto. Yo me basé en el código original, donde no hay otra cosa que una imagen.

Es más, mirando bien, resulta que allí está

Código:

...a><img src="...

y yo escribí

Código:

....jpg'" ><img height=...

en vez de

Código:

....jpg'" >
<img height=...

porque en este último caso, el primer elemento sería un texto, el "retorno de carro" (13) previo a la "nueva línea" (10). Y javascript va a intentar meterle el src a él. Y no va a poder.

Por otro lado, los eventos siempre van en el html. Ni hablar cuando están en las etiquetas de HTML, como en el caso que nos propone (¿será eso?) ch3ssmaster. Lo discutible será que no llamen a una función, que generalmente está fuera del body. Pero en el caso de que haya un solo enlace, o varios con distintos juegos de imágenes, casi no vale la pena crear una función.

Código:

<a href="javascript:void()" 
onmouseover="cambia('http://img23.imageshack.us/img23/3299/chemendietapedroechage1.jpg', this)"  
onmouseout="cambia('http://img840.imageshack.us/img840/6296/chemendietapedroechage2.jpg', this)" ><img height=320 
src="http://img840.imageshack.us/img840/6296/chemendietapedroechage2.jpg" /></a>

Algo más que habría que evitar en una página real es el void(0) como destino del link, y el atributo height dentro de la imagen.
Pero es discutible.

[ch3ssmaster]

Iniciado por furoya

Mucha limitación, ch3ssmaster. Pero quiero suponer que no es capricho.

No lo es, estoy creando un tema personalizado para moodle y las opciones en css en este caso concreto no valen.

Iniciado por furoya

Aprovecho para dar otra interpretación (porque tu mensaje no es nada claro en sus sobrevuelos) a la que puso emprear : que al pasar el puntero sobre el enlace se cambie la imagen, porque quieres los eventos en el enlace.

traductor de google:

hover -> hover : flotar float, hover, drift, waft, wave, revolotear, estar suspendido

sobrevolar era una forma de abreviar el "pasar el puntero sobre el enlace", que creo que semanticamente es correcto, aunque no sea lo más técnico.

Iniciado por furoya

Ahí la pregunta tiene más sentido, porque no cualquier novato sabe cómo apuntar el elemento hijo.

Gracias por el aporte ya que resolvió el problema, y en efecto no supe explicarme de un modo muy técnico, pido disculpas si mi pregunta ha molestado, quizá por no saber más al respecto, aunque de otro modo quizá no hubiera necesitado preguntar.

Ha quedado claro que necesitaba saber "como apuntar al elemento hijo en javascript" de haberlo sabido así ya no habría preguntado y habría buscado la respuesta.

De cualquier modo ha sido instructivo así que gracias.

[furoya]

Iniciado por ch3ssmaster

hover -> hover : flotar float, hover, drift, waft, wave, revolotear, estar suspendido

sobrevolar era una forma de abreviar el "pasar el puntero sobre el enlace", que creo que semanticamente es correcto, aunque no sea lo más técnico.

Gran excusa. Seguro ya va al Top Ten de las mejores del Foro.

Y la pregunta no molesta. Si pensara que vienes a molestar y no a aprender, la respuesta hubiese sido en otro tono.

Me alegra que te haya servido.