开发者

Google Maps v2 div inside or over map

I just need put one div (or more) inside or over map, something like a menu inside 开发者_JS百科the map area,

I need when i load my map this div is there...

css can't do it right?

that div contains php code...


Yes, that can easily be done with CSS positioning. Consider the following short example:

<!DOCTYPE html>
<html> 
<head> 
  <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
  <title>Google Maps v2 API: Floating Div</title> 
  <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false"
          type="text/javascript"></script> 
</head> 
<body onunload="GUnload()"> 

  <div style="position: relative;">
    <div id="map_canvas" style="width: 400px; height: 300px;"></div> 
    <div style="position: absolute; top: 0px; 
                width: 100px; height: 100px; background-color: grey;">
      Menu Here
    </div>
  </div>

  <script type="text/javascript"> 
    var map = new GMap2(document.getElementById("map_canvas"));
    map.setCenter(new GLatLng(38.00, -100.00), 3);
  </script> 
</body>
</html>

Screenshot:

Google Maps v2 div inside or over map


This worked for me on Google Maps API3.

Where my menu drop-down elements now overlays Google Maps API3 in the correct order.

This is the important css code:

.menudropdown {
  position: fixed;
  z-index:2;
}

#map {
  position: absolute;
  z-index:1;
}
0

上一篇:

下一篇:

精彩评论

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

最新问答

问答排行榜