Wie kann ich ein HTML -Div über das Google Earth -Plugin platzieren? Beteiligt WMODE, stelle ich mir vor

Question

Ich habe Probleme Legen eines HTML Div über das Google Earth -Plugin In einer Webanwendung würde jede Hilfe geschätzt.

Es ist in Ordnung für Karte, Gelände und Hybridmodus, aber auf 'Erde'Modus, der Flash tritt ein und legt automatisch die Karte darüber hinaus.

Z-Indexing hilft nicht.

Vermutlich konnte ich so etwas wie:

document.getElementById('flashDiv').setAttribute('wmode', 'opaque');

Aber angesichts der Tatsache, dass Googles Sachen im laufenden Fliegen zusammengestellt werden, macht es es viel schwieriger. Das Anzeigen des generierten Codes hat hier nicht geholfen. Auch hier können Sachen wie Swfobject den Tag nicht retten ...

Hat jemand etwas Ähnliches gestoßen? Ich habe den Morgen damit verbracht, die Google Earth -API -Gruppe ohne viel Erfolg zu haben.

Aktualisieren: Nach weiteren Haaren kann die Antwort mit einem liegen Iframe Shim. Vielleicht bin ich auch zu dem Schluss gesprungen, dass das Plugin auf Flash-basiert ist. Untersuchung ...

_{(Quelle: Googlepages.com)}

Answer 1

Ich habe eine Demo zusammengestellt, die zeigt, wie man benutzt IFRAME SHIPS HIER:

http://earth-api-samples.googlecode.com/svn/trunk/demos/customcontrols/index.html

Answer 2

Es gibt keine direkte Unterstützung für das Überlagern von "Z-Indexing" A Div entweder in der API oder in DOM. Das Plug-in lädt eine ausführbare Datei, die in sehr einfachen Worten ein Loch in das Browserfenster stanzt. Die Verwendung der "Iframe Shim" -Technik ist die Standard -Problemumgehung, obwohl Transparenz schwierig sein kann.

Da ist ein Offene Feature -Anfrage Damit diese Funktionalität zur API hinzugefügt werden kann, enthält der Kommentarbereich einige gute Informationen und Links.

Außerdem gibt es ein tolles Online Demo davon hier

Answer 3

Wenn es sich um ein Plugin handelt, können Sie andere Elemente nicht zuverlässig darüber legen. Browser lassen in der Regel die meisten ihrer Fähigkeit los, Elemente zu "zu schichten", wenn Plugins beteiligt sind.

Ich denke, ein Iframe kann ein Weg sein, solange Sie überprüfen, ob dies immer noch bei den meisten Browsern funktioniert.

Answer 4

Nachdem Google den Code eingebettet hat, sieht es so aus, als wäre er mit einem Iframe. Wenn Sie jedoch Probleme mit einem Blitz haben, siehe unten ...

Laufen in ähnliche Situationen mit dem Versuch, eine Dropdown -Navigation über ein Flash -Element (oder HTML über ein YouTube -Video) anzuzeigen. Es gab einige Faktoren, die ins Spiel kamen.

Das erste war mein HTML -Element, von dem ich über das Flash -Element schweben wollte, musste ein Geschwister -HTML -Element sein, wobei die CSS -Eigenschaften für jedes Geschwisterelement und auch für die übergeordnete DIV eingestellt waren. Also zum Beispiel:

<div id="parent">
  <div id="sibling"></div>
  <embed id=”flash”><other script code></embed>
</div>

Dann wäre mein CSS

//.parent may not need to be set to relative
#parent   { position: relative; }
// the value on sibling1 just needs to be higher than .sibling2
#sibling  { position: relative; z-index: 20; }
#flash    { position: relative; z-index: 10; display:inline }

Die andere Sache, die erwähnenswert ist, ist, dass Ihr Blitz den WMODE -Parameter auf transparent eingestellt hat.

Dieser Trick hat sowohl für verschiedene Flash -Anwendungen als auch für YouTube -Videos funktioniert - der Trick besteht darin, sicherzustellen, dass die HTML, die Sie über dem Blitz anzeigen möchten HTML Die Anzeige über dem Blitz ist höher als das Flash -Element, beide HTML -Elemente haben ihre Positionierung entweder auf relativ oder absolut eingestellt, und der WMODE -Parameter ist auf transparent eingestellt.

Hoffentlich hilft das - aber ich vermute, dass Ihr Problem mit dem Iframe liegt.

Answer 5

Stellen Sie "iframe" Z-Index auf 100 ein

und setze div, die oben Z-Index bis 200 angezeigt wird (DIV muss mindestens die Position relativ sein)