Possible to Hide mouse event from image?

Design help General
1

I have a problem I’m scratching my head about… I have video thumbnails that open up lightboxes when you click on them. The only problem is… I have a div that is placed over top of the image (with a play button image) that doesn’t allow you to click on the image to open the lightbox if your mouse if hovered over top of it.

Does anyone know how to hide that image from a mouse event so that regardless of where your cursor is in that div it will still open the lightbox?

area
area1388×1208 390 KB

Here is my site Read-Only: Webflow - Eclipse6

The Page in question is: https://eclipse6.webflow.io/videos

1 Like
2

Hey @Bodwa

Try using pointer-events: none;

Code:

<style>
.playicon {
  pointer-events: none;
}
</style>

Add the code to your head area

Piter :webflow_heart:

3

@PeterDimitrov

SO MUCH LOVE. Thank you for this!! I was hoping it would be a simple thing like this. You’re a lifesaver. Thanks for your quick response to this! Worked like a charm :smile:

Thanks again!

1 Like
4

Awesome! Happy to help :webflow_heart: