Bootstrap FullScreen谷歌地圖不是Resonsive

你可以看看下面的LINK，讓我知道爲什麼地圖不響應？我在正確定位時也遇到了一些問題，我很感激能否幫助我在頁面中正確地放置地圖？Bootstrap FullScreen谷歌地圖不是Resonsive

這裏是我的CSS和HTML，以及，

<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <!-- The styles --> 
<link href="css/bootstrap.css" rel="stylesheet"> 
<link href="css/bootstrap-responsive.css" rel="stylesheet"> 

<!-- JS Libs --> 
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
<script src="http://maps.google.com/maps/api/js?sensor=false&dummy=.js"></script> 
<script src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/routeboxer/src/RouteBoxer.js" type="text/javascript"></script> 
</head> 
<body> 
<div class="row"> 
<div class="navbar navbar-inverse navbar-fixed-top"> 
<div class="navbar-inner"> 
<div class="container"> 
    <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    </a> 
    <a class="brand" href="#">Brand</a> 
    <div class="nav-collapse collapse" id="spanClasses"> 
    <ul class="nav"> 
     <li class="active"><a href="#">Home</a></li> 
     <li><a href="#">Link</a></li> 
     <li class="divider"></li> 
     <li><a href="#">Link</a></li> 
     <li class="divider"></li> 
     <li><a href="#">Link</a></li> 
     <li class="divider"></li> 
    </ul> 
    </div> 
</div> 
</div> 
</div> 
</div> 
<div id="map"> 
<div id="map_canvas"></div>  
</div>

和css：

body { padding-top:42px; height: 100% } 
#map_canvas { width: 99%; height: 100%;} 
#map{ padding-left:10px; padding-right:0px;}

來源

2013-06-28 Mona Coder

縮小什麼你期望地圖做什麼？定義resposive ...我沒有看到滾動條出現，所以似乎對我有反應？.. – Pevara

該地圖是不是一個圖像，也不會當你縮小你的瀏覽器

來源

2013-06-29 00:10:56 Pascamel

Bootstrap FullScreen谷歌地圖不是Resonsive

回答

相關問題