我正在玩Twitter Bootstrap,Leflet和Jquery。我有下面的网站。https://dl.dropbox.com/u/3988632/site/test.html
我已经四处挖掘,找不到一种让传单图在Div容器中100%的高度的方法。地图高度扩大了视口,似乎正在导致窗户向下滚动并隐藏标头。以下是我实现Bootstrap选项卡的方式。
<div class="bs-docs-example">
<ul id="myTab" class="nav nav-tabs">
<li class="active"><a href="#home" data-toggle="tab" id="map1">Map</a></li>
<li><a href="#profile" data-toggle="tab">Help</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Admin <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#dropdown1" data-toggle="tab">User Preferences</a></li>
<li><a href="#dropdown2" data-toggle="tab">Setup</a></li>
</ul>
</li>
</ul>
<div id="myTabContent" class="tab-content">
<div class="tab-pane fade in active" id="home">
</div>
<div class="tab-pane fade" id="profile">
<p>Test Help</p>
</div>
<div class="tab-pane fade" id="dropdown1">
<p>Test Dropdown1</p>
</div>
<div class="tab-pane fade" id="dropdown2">
<p>Test Dropdown2</p>
</div>
</div>
</div>
i然后将地图加载到第一个选项卡中。
<script>
$('#home').load('https://dl.dropbox.com/u/3988632/Site/maptest.html');
</script>
如果我尝试将CSS文件中的高度设置为高度:100%;但是持有地图的容器的高度为0px。
我已经尝试了此jQuery脚本将地图Div调整为包含Div,但没有成功。
//Initial load of page
$(document).ready(sizecontent);
//窗口的每个大小$(window).resize(sizecontent);
//动态分配高度函数sizecontent(){ var newheight = $("#container")。height()/* - $("#header")。height() - $("#footer")。height() " px"*/; $("#map")。css("高度",newheight);}
任何帮助将不胜感激。
从我记得的情况下,由于安全原因,我们无法通过Ajax加载其他网站内容。.其他堆栈流问题可能能够帮助您..无法加载带有jQuery的外部页面。加载到我的页面中的DIV