日期:2014-05-16  浏览次数:20343 次

请高手帮忙看下这段代码
代码如下

index.html

<html>
<head>
<link rel="stylesheet" href="view/leaflet.css" />
<!--[if lte IE 8]>
<link rel="stylesheet" href="view/leaflet.ie.css" />
<![endif]-->
<link rel="stylesheet" href="view/bootstrap.min.css">
<link rel="stylesheet" href="view/bootstrap-theme.min.css">
<link href="view/bootstrap-combined.no-icons.min.css" rel="stylesheet">
<link href="view/font-awesome.css" rel="stylesheet">
<link rel="stylesheet" href="view/style.css"/>
<script src="js/lib/jquery-1.10.2.min.js"></script>
<script src="js/lib/bootstrap.min.js"></script>
<script src="js/lib/bootstrap-dropdown.js"></script>
<script src="js/lib/bootstrap-button.js"></script>
</head>
<body>
<!--Insert panel via DOM insertion through jQuery in the future-->
<div id="panel" style="background-color:maroon;">
        <div style="position:absolute; float:right;">
<button id="paneltoggle" class="btn">Hide panel</button>
</div>
<div id="map"></div>
</body>
<script src="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.js"></script>
<script src="js/map.js"></script>
<script src="js/panel.js"></script>
</html>



panel.js:

$('.dropdown-toggle').dropdown();

var hidden=false;

$("#paneltoggle").click(function() {
$("div.panel").toggle(1000);
$("div.map").attr("style", "width:100%;");
});



我想点击按钮来隐藏面板,显示整块地图。 但现在点击Hide Panel按钮只能隐藏panel里的东西,但红色背景还是存在,而且地图部分不能变成100%。

小弟初接触javascript,请版里高手指点。

------解决方案--------------------
$("#paneltoggle").click(function() {
    $("div#panel").toggle(1000);
    $("div#map").attr("style", "width:100%;");
});
.是class #为id
------解决方案--------------------
把那个按钮放到那个要隐藏的div外面来
------解决方案--------------------
<body>
    <!--Insert panel via DOM insertion through jQuery in the future-->
    <div id="panel" style="background-color:maroon;">
        <div style="positi