Point events with overlapping elements

Problem: Unable to send pointer events to DIV below another DIV

Saola Animate version: 2.7.1

OS: Windows


Hello. Really sorry for 3rd post in just a short amount of time. But, I can’t really seem to be able to figure this out.

I’m willing to trigger some animations on mouse hover as you might have seen in my previous posts. But, the layout I’m trying to go for is including some groups overlapping others and thus, the groups which are underneath are not working.

This is the kind of layout I’m planning to achieve:

And this is how I have arranged it in Saola Animate so far:

So, the problem is that the yellow one is not able to receive any pointer events because of the orange one. I tried setting cursor to none to the groups and set cursor to default on the elements inside the group, but, that didn’t help.

Please tell me that what I’m trying to achieve is possible.

Here’s my file: pointer-events.saolapack (13.8 KB)

My bad. I thought, the ‘Cursor’ in the application also sets pointer events. I set the pointer events using CSS and it works just fine.

Hi Hrishikesh,

In the next major version (version 3), pointer events will be set automatically so that users can click through non-painted areas.


1 Like

Hai Hrishikesh Kokate, possible it have something to do with the “grouping” I did a ungroup and then I grouped the part again and now the group is smaller and not hiding the “DaVinci Resolve” anymore!

That’s possible. But, it’s safer to avoid pointer-events on those groups altogether as the groups are just created for organization (and scaling) purposes. It might have worked for that, but, I had to create more of such groups. So, I was duplicating the group and replacing the images so that all other properties are maintained. So, ungrouping and grouping again for each of them is not a good idea.

P.S.: I’m eagerly waiting for version 3 as I think it’s going to have innerHTML support which might help me reduce the number of requests I have to make to the network to fetch the 3 parts of all of these icons.

Sorry I didn’t see the other timelines, and the growing off the buttons, stupid of me