2
請考慮:http://jsfiddle.net/msNs5/3/如何指定傳單地圖的「活動」區域?
我有一個地圖div在頁面加載時擴大到全尺寸,另一個半透明div覆蓋它的底部。美學上,我真的很喜歡底部div如何與背後的地圖一起看,但我需要做到這一點,以便未被透明div覆蓋的區域是「活動」區域。
I.E.當地圖計算標記和多邊形的界限並設置它的視圖時,它會計算出該地圖區域,而不是整個地圖本身。人們似乎認爲這是可能的,但我正在努力與實際的實施。
代碼從小提琴低於:
// JavaScript
var map = L.map('map', { center: [51.505, -0.09], zoom: 13 });
osm = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {});
map.addLayer(osm);
function initMap() {
$('#map').css({"height": $(window).height() + "px"});
map.setView(map.getCenter(),map.getZoom());
}
var id;
$(window).resize(function() {
clearTimeout(id);
id = setTimeout(initMap, 500);
});
$('#map').css({"height": $(window).height() + "px"});
map.setView(map.getCenter(),map.getZoom());
/* CSS */
#map { position: fixed; z-index: -1; width: 100%; }
#header { height: 40px; background: black; }
#otherstuff { position: fixed; bottom: 0px; width: 100%; background-color: rgba(255,255,255,0.6); height: 30%; }
<!-- HTML --->
<!DOCTYPE html>
<body>
<div id="header"></div>
<div id="map"></div>
<div id="otherstuff">xxx</div>
</body>