网页放大时如何处理地图答案

【问题标题】：How to handle map when web page is zoomed in网页放大时如何处理地图
【发布时间】：2013-12-06 19:09:48
【问题描述】：

我有一个包含地图的 iframe 网页。所以我的html看起来像：

<div>
<iframe src="url" >
 <!Doctype html5>
  <html>
    <head></head>
    <body>
      <div id="map"></div>
    </body>
  </html>
</iframe> 
</div>

id 为“map”的 div 的高度为 100%，因此 div#map、iframe 页面正文将具有与 iframe 相同的宽度和高度。现在，当用户放大页面时，我正在通过 javascript 调整 iframe 的大小，使其看起来与缩放级别 1 时完全相同。

当我调整 iframe 的大小时，它的内部内容 div#map 也会调整大小（意味着它的高度和宽度会根据 iframe 改变）但地图仍然处于放大状态。

有什么方法可以在查看缩放级别 1 时显示地图？我正在使用 bing 和 google map api。

请帮帮我。

【问题讨论】：

【解决方案1】：

调整窗口大小时地图不会缩放。它可能看起来被放大了，这是一种视错觉。此外，为确保您的地图填满 iframe 内部，请确保地图页面具有以下 CSS 样式：

html, body{
margin:0;
padding:0;
height:100%;
width:100%;
}

#map{
position:relative;
width:100%;
height:100%;
}

【讨论】：