superfish drop down menu over google earth plugin_问答_开发者

superfish drop down menu over google earth plugin

开发者 https://www.devze.com 2023-03-19 09:46 出处：网络

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.

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.