Durch den transparenten Bereich eines Bildes klicken

Question

Kann html/css nativ durch den transparenten Bereich eines Bildes klicken?

Ich möchte zwei Gebäude nebeneinander platzieren. Und wenn ein Benutzer auf einen transparenten Bereich (grün) des nächsten Bildes klickt, würde der Klick durchgehen und um so weiter gehen (der größere).

Ich habe bereits überprüft, ohne Glück:

Click through transparent area on partially transparent image

Click area on sprite in canvas

Answer 1

HTML/CSS allein könnte sehr schwierig sein. Sogar plus Javascript, denn wenn Sie auf das rote Hausbild klicken, wird das Ereignis auf dem Bild selbst ausgelöst. Und der von Ihnen definierte grüne Bereich ist kein Quadrat. Es ist schwierig, einen solchen Bereich einfach in html/css zu definieren.

Mein Vorschlag wäre ein weiteres Bild von dieser grünen Form, mit dem genauen Inhalt und fügen Sie es auf dem roten Haus Bild. Als Ergebnis haben Sie drei Bilder mit dem weiter unten liegenden, dem roten Haus oben auf dem Gebäude und der speziellen Form, die aus dem Gebäude oben auf dem roten Haus gemacht wurde. Klickt man also auf den transparenten Bereich, klickt man tatsächlich auf die spezielle Form und klickt stattdessen auf das rote Hausbild. Dann können Sie einen Link an die spezielle Form des grünen Bereichs anhängen, so dass es mit den zwei Ebenen Gebäude verbindet. Dies ist die einfachste Methode, an die ich denken kann.

Ich hoffe, es hilft.