开发者

superfish drop down menu over google earth plugin

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>
 开发者_StackOverflow   <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>


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:

  • http://code.google.com/p/earth-api-samples/issues/detail?id=9

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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜