0

tengo una duda acerca de las imagenes transparente, sucede que tengo esta imagen(Por ejemplo)introducir la descripción de la imagen aquí

Disculpen el tamaño, pero bueno, lo que quiero saber es si existe alguna manera de colocar por ejemplo un evento de tipo ratón como seria "mouseover" y que interactue únicamente con la parte visible de la imagen, es decir que ignore el fondo transparente.introducir la descripción de la imagen aquí

A ver si con esto me explico mejor, quiero que la parte que esta rayada de azul no sea afectada por el Mouse event, solamente la parte visible, es decir la tarjeta de Messi, o al menos poder recortar la imagen.

2 respuestas 2

1

Pues existen dos formas, primero es usar dos imágenes, una en su modo normal y otro con el efecto que quieres para que aparezca al hacer hover, ocultas una y muestras otra, la otra opción es crear la forma de la imagen con css, así afectar al contenedor, no a la imagen, ya que por defecto css no detecta los bordes de una imagen png.

1
  • Podrías explicar un poco más la 2da opción por favor?
    – VictorM03
    el 17 feb. 2021 a las 13:21
1

Puedes usar la etiqueta <area></area> https://www.w3schools.com/tags/tag_area.asp. Pero tendrías que especificar las coordenadas del área que será clicable. Puede hacer esto con un programa como Photoshop o Illustrator.

1
  • Lo intentaré 😃
    – VictorM03
    el 17 feb. 2021 a las 13:23

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.