Wie kann ich einen HTML-Div über das Google Earth-Plugin platzieren? Bezieht sich wmode, stelle ich mir

Question

Ich habe Probleme mit einem HTML-Div über das Google Earth-Plugin in einer Web-Anwendung, würde jede Hilfe geschätzt werden.

Es ist in Ordnung für Karte, Terrain und Hybrid-Modus, aber auf ‚Erde‘ -Modus, der Blitz schlägt in und die Karte automatisch Schichten auf.

Z-Indizierung hilft nicht.

Vermutlich könnte ich etwas tun:

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

aber wenn man bedenkt, dass Google die Sachen on the fly erstellt wird, macht es viel schwieriger. Das Anzeigen des generierten Codes hat hier nicht geholfen. Da es im laufenden Betrieb kompiliert wird, können Sachen wie SWFObject den Tag nicht speichern ...

Hat jemand Ähnliches gefunden? Ich habe den Morgen damit verbracht, die Google Earth API-Gruppe ohne viel Nutzen zu durchsuchen.

Update: Nach mehr Haare ziehen, kann die Antwort mit einem iframe shim liegen. Ich bin vielleicht auch zu dem Schluss gekommen, dass das Plugin Flash-basiert ist. ... Untersuchung

alt text http://neilsimonmckeown.googlepages.com/overlay.jpg

Answer 1

ich eine Demo zusammen zeigen, wie IFRAME Beilagen hier verwenden:

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

Answer 2

Wenn es ein Plugin ist, dann kann man nicht zuverlässig andere Elemente über die Spitze davon platzieren. Browser lassen normalerweise die meisten ihrer Fähigkeit, Elemente zu "schichten", wenn Plugins beteiligt sind.

Ich denke, ein Iframe kann ein Weg um ihn sein, solange Sie überprüfen, dass dies immer noch funktioniert in den meisten Browsern.

Answer 3

Nachdem wir untersucht haben, wie Google den Code einbetten kann, sieht es so aus, als wäre es ein iFrame. Dennoch, wenn Sie Probleme mit einem Blitz haben, sehen Sie unten ...

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

Das erste war mein HTML-Element, das ich über das Flash-Element schweben wollte, musste ein Geschwister-HTML-Element mit den CSS-Eigenschaften für jedes Geschwisterelement und auch für das Elternteil div sein. So zum Beispiel:

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

Dann würde mein css seine

//.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, erwähnenswert ist, Ihre Flash der wmode-Parameter auf transparent gesetzt haben muss.

Dieser Trick hat für verschiedene Flash-Anwendungen sowie YouTube Video funktioniert - der Trick ist, um sicherzustellen, dass die HTML, die Sie über den Flash angezeigt werden soll ein Geschwisterelement zum eigentlichen Flash-Code und nicht die Eltern Div, die z -Index für das HTML, das über den Flash angezeigt wird, ist höher als das Flash-Element, beide HTML-Elemente sind entweder relativ oder absolut positioniert, und der Parameter wmode ist auf transparent gesetzt.

Hoffentlich hilft das - aber ich vermute, dass Ihr Problem mit dem iFrame ist.

Answer 4

Es gibt keine direkte Unterstützung für die Überlagerung von 'Z-Indizierung' ein div entweder in der Api oder Dom. Das Plug-in lädt eine ausführbare Datei, die in sehr einfacher Weise ein Loch im Browserfenster ausstanzt. Die Verwendung der "iframe shim" -Technik ist die Standardumgehung, obwohl Transparenz schwierig sein kann.

Es gibt eine open Feature request für diese Funktionalität hinzugefügt werden, um die API - die Kommentare Abschnitt hat einige gute Informationen und Links.

Außerdem gibt es eine große Online-demo of this here

Answer 5

set "iframe" Z-Index auf 100

und setzen div, die oben auf z-index bis 200 angezeigt wird (div muss mindestens relative Position sein)