Can html/css, natively, click through the transparent area of an image?
I'd like to place two buildings side by side. And if a user clicks on a transparent area (green) of the nearest image, the click would pass through and go the the farther (the taller one).
I've already checked, with no luck:
Click through transparent area on partially transparent image
html/css alone might be very difficult. Even plus javascript, because when you click on the red house picture, the event is triggered on the picture itself. And the green area you defined is not a square. it is hard to define such a area simply in html/css.
My suggestion would be add another picture of that green shape, with the exact content of it and put it on top of the red house picture. As a result, you have three pictures with the farther one at bottom, the red house on top of the building, and the special shape made from the building on the top of the red house. So when people click on the transparent area, they actually click on the special shape instead click on the red house picture. Then you can attach a link to the special shape of green area so it link to the two levels building. This is the easiest method I can think about.
Hope it helps.
