PhoneGap + Leaflet + Jquery Mobile

Question

我正在嘗試使用PhoneGap應用程序獲取Leaflet地圖，並且地圖不會呈現全屏，我也不確定原因。

的index.html

<div data-role="content" id="map" style="width:100%;height:70%;position:absolute;"> 
    var map = new Map(); 
    var $map = $('#map'); 
    $map.height($(window).height() - $map.offset().top); 

maps.js

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

L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { 
      attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' 
      }).addTo(map); 

L.marker([51.5, -0.09]).addTo(map) 
.bindPopup('A pretty CSS3 popup. <br> Easily customizable.') 
.openPopup(); 
} 

但我不斷收到這其中地圖是關閉的最右邊，並不會加載任何其他地方：

http://postimage.org/image/r0e49wgt5/

（不會讓我張貼有信譽的圖像​​）

更新

，如果我打開應用景觀地圖將加載，但如果我留在肖像地圖將顯示爲灰色

Answer 1

嘗試map.invalidateSize();後顯示地圖。