• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

SVG - Pointer-Events funktionieren nicht wie gewünscht/gedacht

SKB

Neues Mitglied
Hallo,
ich habe ein kleines Verständnisproblem zu Elementen in in einem SVG Element.

Das SVG-Element sieht wie folgt aus:

HTML:
<svg viewBox="0 0 550 530" class="" preserveAspectRatio="xMinYMid meet" id="svg_display" width="550">
        <!-- Definations-->
        <g id="placeholder_elements" class="placeholders">
            <foreignObject class="all_elements added_elements type_fObj" x="79" y="207" id="43" width="250" height="300">
<iframe src="https://www.koeln.de"
                    style="overflow:auto;" xmlns="http://www.w3.org/1999/xhtml" width="100%" height="100%"></iframe>
            </foreignObject>
            <image class="all_elements added_elements type_image" x="4" y="93" id="41"
                preserveAspectRatio="xMidYMid meet" width="100" height="100"
                href="https://www.wunderground.com/static/i/c/v4/28.svg"></image>
        </g>
    </svg>

Leider werden hier die Pointer-Events nicht auf den iframe weitergereicht, was vermutlich an der "g"-group liegt.

Somit dachte ich mir, ich deaktiviere diese in der Gruppe und aktiviere sie für die Elemente innerhalb der Gruppe mit:
CSS:
        .placeholders {
            pointer-events: none;
        }

        .placeholders * {
            pointer-events: all;
        }

Laut Firefox "Element untersuchen" werden die pointer-events auch auf die Klasse aktiviert - jedoch leider nicht an das eingebettete iframe weitergegeben.

Weiss hier jemand Rat?
Vielen Dank im Voraus!
 
Werbung:
Dein Vorhaben funktioniert bei IFrames nicht, da kannst du nichts machen.
Komisch ist, das dies hier für das foreignObject funktioniert und somit die events auch an das iframe gehen. Dann funktioniert aber das image (welches über Class-Listener läuft) nicht mehr.

CSS:
foreignObject * {
            pointer-events: all;
        }

Ich kann mir irgendwie nicht so ganz vorstellen, dass das insgesamt "nicht geht".
 
Werbung:
Zurück
Oben