Как разместить html-div над плагином Google Планета Земля? Вовлекает wmode, я думаю
У меня возникли проблемы с установкой html div над плагином Google Earth в веб-приложении, любая помощь будет оценена по достоинству.
Это нормально для карт, ландшафта и гибридного режима, но в режиме « Земля » вспышка начинает и автоматически выравнивает карту сверху .
Z-индексация не помогает.
Предположительно, я мог бы сделать что-то вроде:
document.getElementById('flashDiv').setAttribute('wmode', 'opaque'); но учитывая, что материал Google компилируется «на лету», это делает его намного сложнее. Просмотр сгенерированного кода здесь не помогло. Опять же, из-за того, что он компилируется на лету, такие вещи, как SWFObject, не могут спасти день …
Кто-нибудь сталкивался с чем-то похожим? Я потратил утреннее траление группы API Google Earth без особых усилий.
Обновление : после большего притягивания волос, ответ может лежать с прокладкой iframe . Возможно, я также перешел к выводу, что плагин основан на Flash. Исследуя …
alt text http://sofru.miximages.com/google-maps/overlay.jpg
Я собрал демоверсию, показывающую, как использовать прокладки IFRAME здесь:
http://earth-api-samples.googlecode.com/svn/trunk/demos/customcontrols/index.html
Нет прямой поддержки для наложения «z-индексации» div в Api или Dom. Плагин загружает исполняемый файл, который простыми словами пробивает отверстие в окне браузера. Использование техники «iframe shim» является стандартным обходным решением, хотя прозрачность может быть сложной.
Существует открытый запрос функции для добавления этой функции в api – в разделе комментариев есть хорошая информация и ссылки.
Кроме того, есть отличная онлайн- демонстрация этого здесь
Если это плагин, вы не можете надежно разместить другие элементы поверх него. Браузеры обычно отпускают большую часть своей способности «сложить» элементы, когда задействованы плагины.
Я предполагаю, что iframe может быть способом обойти его, пока вы проверяете, что это все еще работает в большинстве браузеров.
Изучив, как пользователи Google внедряют код, похоже, что это с iFrame. Тем не менее, если вы сталкиваетесь со всеми проблемами со вспышкой, см. Ниже …
Выполнение подобных ситуаций с попыткой отобразить выпадающую навигацию по элементу flash (или html поверх видео YouTube). Было несколько факторов, которые вступили в игру.
Первым был мой элемент html, который я хотел навести на элемент flash, должен был быть элементом sibling html с параметрами css, заданными для каждого элемента sibling, а также для родительского 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, который вы хотите отобразить во флэш-памяти, является элементом -элементом для фактического флэш-кода, а не родительским div, z-index для html для отображения над вспышкой выше, чем элемент flash, оба элемента html имеют свое позиционирование, установленное как относительное, так и абсолютное, а параметр wmode установлен на прозрачный.
Надеюсь, это поможет, но я предполагаю, что ваша проблема связана с iFrame.
установить «iframe» z-index на 100
и установите div, отображающий верхний индекс z до 200 (div должен быть по крайней мере относительным положением)