我正在尝试在我的网页上放置一个固定位置的地图。我在下面放了一段 index.html 文件。我有一个div
withid="map-mini"
下一个div
with class="map-container"
。
我将地图容器的位置定义为固定的(post.css 文件在文件末尾给出)。
我使用 post.js 中给出的函数初始化地图。但是,当我刷新网页时,地图未初始化。
你有什么建议可以解决我的问题吗?
给定代码的jsfiddle如下:http: //jsfiddle.net/N2V8S/2/
问候。
索引.html:
<div class="container-fluid">
<div class="row-fluid">
<div class="span2">
<div class="map-container">
<div id="map-mini"> </div>
</div>
</div>
<div class="span8">
<div id="post">
<div class="body"></div>
</div>
</div>
</div>
post.js:
$(document).ready(function() {
var map_id = '#map-mini';
var lat = 41.04207384890103;
var lng = 29.0972900390625;
var zoom = 11;
var myOptions = {
zoom : zoom,
center : new google.maps.LatLng(lat, lng),
mapTypeId : google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map-mini"), myOptions);
});
post.css:
.map-container{
position: fixed;
border: solid gray 1px;
width: 17%;
height: 80%;
top: 50px;
left: 0.5%;
}