2

我尝试了很多解决方案，但都没有奏效。

我有一个带有固定页眉和页脚的布局（真正固定不消失），我喜欢<div data-role="content">用地图填充。我还希望在此内容 div 中禁用垂直和水平滚动。

解决方案不起作用：
当嵌入到 jQuery Mobile 中的 jQuery Mobile“页面”
谷歌地图中时，Google Map 会延伸到页面边缘
如何使用 jquery mobile 创建 100% 高度的 div？
JQuery-Mobile 内容区域 100% 头和脚之间的高度
在 Jquery Mobile 中最大化 div[data-role=content]
如何使用 jQuery Mobile 显示全屏谷歌地图？

4

1 回答 1

3

一年多后，但如果有人仍然想解决这个问题，这里是如何：

使用 jquery mobile 1.3.1 和 Google Maps API v3 测试

在 HTML 中，将其用于内容：

<div data-role="content">
    <div id="mapDiv"></div>
</div>

提示：不要data-fullscreen在页面的任何 div 上使用。

比，在你的 CSS 中，使用这个：

#mapDiv {
    padding: 0;
    position : absolute !important; 
    top : 40px !important;  
    right : 0; 
    bottom : 58px !important;  
    left : 0 !important;     
}

记得在你的 mapDiv 中创建你的地图，所以你的 JS 会是这样的：

map = new google.maps.Map(document.getElementById('mapDiv'), mapOptions);

就是这样！即使您旋转显示它的设备，它也会起作用。

提示：您必须在页眉和页脚中使用data-position="fixed"and data-tap-toggle="false"。

于 2013-11-13T17:55:24.807 回答