Foros del Web » Programando para Internet » Javascript »

Detección de zonas transparentes

Estas en el tema de Detección de zonas transparentes en el foro de Javascript en Foros del Web. Hola, me pregunto si JavaScript puede activar un evento cuando mueves el ratón sobre una imágen GIF o PNG que contiene zonas transparentes y estás ...
  #1 (permalink)  
Antiguo 09/02/2010, 14:24
 
Fecha de Ingreso: febrero-2010
Mensajes: 37
Antigüedad: 14 años, 2 meses
Puntos: 0
Detección de zonas transparentes

Hola, me pregunto si JavaScript puede activar un evento cuando mueves el ratón sobre una imágen GIF o PNG que contiene zonas transparentes y estás encima solamente de las zonas que tienen un color.
A ver, supongamos que tenemos una foto GIF de 200px por 200px dentro de la cual está dibujado el mapa de España y todo lo que la rodea es transparencia. Hay alguna manera de que te salga un alert pero solamente cuando estás moviendo el ratón sobre el area de la tierra(no la transparencia, digamos, el mar).
¡Gracias!
  #2 (permalink)  
Antiguo 09/02/2010, 14:44
Avatar de buzu  
Fecha de Ingreso: octubre-2006
Ubicación: San Francisco, CA
Mensajes: 2.168
Antigüedad: 17 años, 6 meses
Puntos: 122
Respuesta: Detección de zonas transparentes

si, teoricamente si se puede, pero resultaría un poco complicado.

Se me ocurre que se puede usar canvas para detectar las zonas transparentes y hacer un mapa de coordenadas las cuales se comparan luego con la posición del ratón. Pero para ser sincero, yo en este caso preferiría invitar al amigo panino5001 a que se uniera a la conversación.
__________________
twitter: @imbuzu
  #3 (permalink)  
Antiguo 09/02/2010, 15:09
 
Fecha de Ingreso: febrero-2010
Mensajes: 37
Antigüedad: 14 años, 2 meses
Puntos: 0
Respuesta: Detección de zonas transparentes

¿Pero hay que usar alguna librería que tuviera que importar o se puede hacer con javascript nada más? No se, a lo mejor podría googlear si alguien me daría unas palabras relacionadas. Lo que estoy intentando hacer es que en una mapa con dos países (como el de la Península Ibérica) cuando mueves el ratón sobre el MAP AREA de uno o del otro(de Portugal o España en este caso) se cree una imágen (una foto recortada de uno de los dos países pero de otro color) que se sobreponga al MAP AREA creeando un efecto MOUSEOVER. Claro, como lo hago con DOM, la imágen nueva creada tiene un zIndex superior y no puedo hacer que al salir del MAP AREA ocurra el evento de desaparecer la imágen que crea el efecto ya que el MAP AREA está detrás de ella. Entonces lo que hago es que esta dezaparezca cuando el ratón está fuera de ella misma, pero claro, como para JavaScript la imágen es cuadrada (ya que le da igual las transparencias) pues esto no ocurre hasta no salir de toda la foto. Lo que pasa es que parte de la foto de un país(la parte transparente) está sobre el otro y tienes que mover el ratón más alla de las fronteras para que cambie de color el otro. Espero que me podáis entender un poco. Muchas gracias por contestar otra vez
  #4 (permalink)  
Antiguo 09/02/2010, 15:29
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Respuesta: Detección de zonas transparentes

Hola:

El mouseover también se puede usar en un tag ares... Creación de áreas en imágenes

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #5 (permalink)  
Antiguo 09/02/2010, 16:24
 
Fecha de Ingreso: febrero-2010
Mensajes: 37
Antigüedad: 14 años, 2 meses
Puntos: 0
Respuesta: Detección de zonas transparentes

¡Muchisimas gracias!
La página que me has dado me ha abierto la mente y ahora lo tengo todo claro y funciona.
¡Muchas gracias otra vez!


Etiquetas: zonas
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 21:56.