Как разместить html-div над плагином Google Планета Земля? Вовлекает wmode, я думаю

У меня возникла проблема размещения html div над плагином Google Earth в веб-приложении, любая помощь будет оценена.

Это отлично подходит для режима карты, местности и гибрида, но в режиме Земля, Вспышка запускает и автоматически выравнивает карту сверху.

Z-индексация не помогает.

Предположительно, я мог бы сделать что-то вроде:

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

но учитывая, что материал Google скомпилирован "на лету", это делает его намного сложнее. Просмотр сгенерированного кода здесь не помогло. Опять же, из-за того, что он компилируется на лету, такие вещи, как SWFObject, не могут спасти день...

Кто-нибудь сталкивался с чем-то похожим? Я потратил утреннее траление группы API Google Earth без особого труда.

Обновление. После большего притягивания волос ответ может лежать с помощью iframe shim. Возможно, я также перешел к выводу, что плагин основан на Flash. Исследуя...

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

Ответ 2

Нет прямой поддержки для наложения "z-индексации" div в Api или Dom. Плагин загружает исполняемый файл, который простыми словами пробивает отверстие в окне браузера. Использование техники "iframe shim" является стандартным обходным решением, хотя прозрачность может быть сложной.

Существует открыть запрос функции, чтобы эта функциональность была добавлена ​​в api - в разделе комментариев есть хорошая информация и ссылки.

Кроме того, здесь есть отличная онлайн-версия

Ответ 3

Если это плагин, вы не можете надежно разместить другие элементы поверх него. Браузеры обычно отпускают большую часть своей способности "сложить" элементы, когда задействованы плагины.

Я предполагаю, что iframe может быть способом, пока вы проверяете, что это все еще работает в большинстве браузеров.

Ответ 4

Посмотрев, как пользователи Google внедряют код, он выглядит как iFrame. Тем не менее, если вы столкнулись с проблемами со вспышкой, см. Ниже...

Выполнение подобных ситуаций с попыткой отобразить выпадающую навигацию по элементу flash (или html поверх видео YouTube). Было несколько факторов, которые вступили в игру.

Первым был мой элемент html, который я хотел навести на элемент flash, должен был быть элементом sibling html с параметрами css, установленными для каждого элемента sibling, а также для родительского div. Итак, например:

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

Тогда мой 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 }

Следует отметить, что ваша флэш-память должна иметь прозрачный параметр wmode.

Этот трюк работал для различных флеш-приложений, а также для видео YouTube - трюк заключается в том, чтобы убедиться, что html, который вы хотите отображать поверх вспышки, является элементом -элементом для фактического flash-кода, а не родительским div, z- индекс для html для отображения поверх вспышки выше, чем элемент flash, оба элемента html имеют свое позиционирование, установленное как относительное, так и абсолютное, а параметр wmode установлен на прозрачный.

Надеюсь, это поможет, но я предполагаю, что ваша проблема связана с iFrame.

Ответ 5

установить "iframe" z-index на 100

и установите div, который отображает верхний индекс z на 200 (div должен быть по крайней мере относительным положением)