谷歌地球插件上的 superfish 下拉菜单
我有这个页面，superfish 菜单不显示在谷歌地球插件上方，而是显示在下方！ 这个问题发生在 IE8 和 Google Chrome 中。 有什么想法吗？ 要运行以下代码，请在 localhost（即使用 google Earth api 密钥注册的域）下运行它
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Page</title>
<link type="text/css" rel="Stylesheet" href="http://users.tpg.com.au/j_birch/plugins/superfish/css/superfish.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://users.tpg.com.au/j_birch/plugins/superfish/js/superfish.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi?key=ABQIAAAAFoBwRF7WovCjsFJemYop1hT2yXp_ZAY8_ufC3CFXhHIE1NvwkxTpGk76aE2Yul2N6gAS9CZLeDBtuA"></script>
<script>
$(document).ready(function() {
$('ul.sf-menu').superfish();
});
var ge;
google.load("earth", "1");
function init() {
google.earth.createInstance('map3d', initCallback, failureCallback);
}
function initCallback(instance) {
ge = instance;
ge.getWindow().setVisibility(true);
}
function failureCallback(errorCode) {
}
</script>
</head>
<body onload="init()">
<ul id="sample-menu-1" class="sf-menu">
<li class="current">
<a href="#a">menu item</a>
<ul>
<li>
<a href="#aa">menu item</a>
</li>
<li class="current">
<a href="#ab">menu item</a>
</li>
</ul>
</li>
</ul>
<div id="map3d" style="width: 500px; height: 380px;"></div>
</body>
</html>
I have this page, the superfish menu does not show over the google earth plugin but under!
This problem is happening in IE8 and Google Chrome.
Any Ideas?
To run the following code run it under localhost (that is the domain registered with the google earth api key)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Page</title>
<link type="text/css" rel="Stylesheet" href="http://users.tpg.com.au/j_birch/plugins/superfish/css/superfish.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://users.tpg.com.au/j_birch/plugins/superfish/js/superfish.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi?key=ABQIAAAAFoBwRF7WovCjsFJemYop1hT2yXp_ZAY8_ufC3CFXhHIE1NvwkxTpGk76aE2Yul2N6gAS9CZLeDBtuA"></script>
<script>
$(document).ready(function() {
$('ul.sf-menu').superfish();
});
var ge;
google.load("earth", "1");
function init() {
google.earth.createInstance('map3d', initCallback, failureCallback);
}
function initCallback(instance) {
ge = instance;
ge.getWindow().setVisibility(true);
}
function failureCallback(errorCode) {
}
</script>
</head>
<body onload="init()">
<ul id="sample-menu-1" class="sf-menu">
<li class="current">
<a href="#a">menu item</a>
<ul>
<li>
<a href="#aa">menu item</a>
</li>
<li class="current">
<a href="#ab">menu item</a>
</li>
</ul>
</li>
</ul>
<div id="map3d" style="width: 500px; height: 380px;"></div>
</body>
</html>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
无法在 Google-Earth-Plugin 窗口顶部应用任意 HTML 内容的 z-index 分层。这里有一个针对该功能的长期功能请求：
在该请求的评论中，发布了涉及 IFRAME 填充程序的解决方法和演示，但这仅适用于iframe 盒装内容。由于插件在浏览器中如何工作的低级细节，我认为短期内不太可能在插件窗口上实现任意内容的 z-index 分层，尤其是在所有浏览器中。
It is not possible to apply z-index layering of arbitrary HTML content on top of the Google-Earth-Plugin window. There is a long standing feature request for that functionality here:
In the comments to that request there are workarounds and demos posted involving an IFRAME shim, but that works only for iframe boxed content. Due to low-level details of how plugins work within browsers, I think it's unlikely z-index layering of arbitrary content over the plugin window will be possible anytime soon, especially across all browsers.