Javascript Jquery Mobile-向页面内容添加响应性传单地图

我需要使传单地图适合在一个JQM页面，其中还包括一个标题。问题是页面是可滚动的，如果不滚动，我就看不到地图的底部。我需要整个页面，以适应窗口大小，没有任何滚动

以下是我到目前为止的情况：

---

当您将贴图的“包含所有元素”设置为100%时，它将占据主体的100%高度，这意味着包含42像素的标题。但是由于头部的原因，

mapPage

元素在顶部填充了42px，因此在底部有42px的额外值。您可以使用CSS计算更改来更正此问题：

#mapPage, #map {
  height: 100%;
}

进入：

现在

#mapPage

不会溢出底部的42px，而

#map content

和

#map

占

#mapPage

的100%，即100%-42px；现在它像手套一样合身

你的小提琴叉子：

如果使用

calc

不是您的选项，您可以使用普通javascript更正元素

mapPage

的高度，或者因为您已经在使用jQuery，所以在初始化地图之前使用jQuery：

var element = $('#mapPage');

element.height(element.height() - 42);

var map = L.map('map').setView([51.505, -0.09], 13);

---

另一个难题是：

非常感谢，我不知道你可以用css实现。因为CSS3是规范的一部分，只有Opera mini不支持它。请看：我看到一些Android浏览器不支持它，这可能是个问题。如果您不选择使用

calc

，我已经添加了另一个解决方案。是的，这就是我想的，现在可以了。顺便说一下，如果您使用页面事件，不要将调整大小放在“pageinit”中，它将不起作用。我在“pageshow”中添加了它，效果很好。

#mapPage, #map {
  height: 100%;
}

#mapPage {
  height: calc(100% - 42px);
}

#map {
  height: 100%;
}

var element = $('#mapPage');

element.height(element.height() - 42);

var map = L.map('map').setView([51.505, -0.09], 13);