DIV über eingebettetes SVG legen?!

[Stephan]

Hallo zusammen!

Ich habe folgendes Problem:

Ich habe eine HTML-Datei mit eingebetteter SVG-Datei. Nun habe ich in der HTML Datei ein DIV, welches als Tooltip dienen soll und dynamisch mit Inhalt gefüllt wird.
Soweit so gut, das mit dem Füllen usw. funktioniert auch, leider wird das DIV hinter dem SVG-Element plaziert und ich weiß nicht wie man es davor kriegt. An den Ecken kann man diesen Effekt genau beobachten, wie sich das DIV hinter das SVG schiebt, wenn man mit der Maus in Richtung der Mitte des SVGs steuert.

Hier mal die Codeschnipsel:
------------------------------------------------------------
...

<div id="ToolTip" style="z-index:1;"></div>

...

<embed width="100%" height="100%%" src="karte.svg" NAME="hptkarte" type="image/svg+xml" style="z-index:2;" /> <!--1230 / 500-->

...

------------------------------------------------------------

Wie Ihr seht hab ichs mit dem z-index probiert, welcher aber keine Wirkung zeigt. Wie schaffe ich es also, dass das DIV vor dem SVG-Element erscheint?

mfg Stephan

[ThomasM]

Hallo Stephan,

<div id="ToolTip" style="z-index:1;"></div>

...

<embed width="100%" height="100%%" src="karte.svg" NAME="hptkarte" type="image/svg+xml" style="z-index:2;" /> <!--1230 / 500-->

...

---

Wie Ihr seht hab ichs mit dem z-index probiert, welcher aber keine Wirkung zeigt. Wie schaffe ich es also, dass das DIV vor dem SVG-Element erscheint?

Dann sollte die z-Index-Reihenfolge eher umgekehrt sein. Besser wäre wohl die Umsetzung des Tooltips innerhalb des SVG-Dokuments (BTW: 100%% --> 100%).

Grüße,
Thomas

[Stephan]

Dann sollte die z-Index-Reihenfolge eher umgekehrt sein. Besser wäre wohl die Umsetzung des Tooltips innerhalb des SVG-Dokuments (BTW: 100%% --> 100%).

Grüße,
Thomas

Hallo Thomas,

ich habe den Eindruckm, dass die z-index anweisung nichts bewirkt. Habe nun sämtliche Varianten durchprobiert, aber immer dergleiche Effekt -> Das DIV schiebt sich hinter die SVG-Grafik.

Ich hab bereits eine Realisierung in SVG erarbeitet, aber die Version mit dem Div ist bei weitem einfacher zu verarbeiten und mit Content zu füllen (für meinen Fall hier).
Es muss doch möglich sein das das DIV Element das SVG überlagert?!

mfg Stephan

[ThomasM]

Hallo Stephan,

Es muss doch möglich sein das das DIV Element das SVG überlagert?!

Möglich vielleicht, wobei die Umsetzung von eingebetteten Inhalten stark vom Browser/OS abhängt. Auch Formularelemente liegen gern "on top". Probiere es alternativ mit object oder iframe aus. Die Tooltip-Inhalte könnten auch in einem XML-Dokument liegen und dann via AJAX-Call dynamisch in die Grafik eingelesen werden ...

Grüße,
Thomas