日期:2014-05-17  浏览次数:20882 次

关于div结合jQuery下拉后,如何使得下方的div不会随上面的div下拉而发生变化
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title></title>
  <style type="text/css">
* { margin:0; padding:0;}
.dl_b{margin:0; padding:15px;height:10px;background:#0099ff}
.c{width:100px;height:30px}
.panel{width:100%;height:300px;background:#8080c0}
  </style>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
 </head>
 <body>
<div id="dlzc" class="dl_b">&nbsp;&nbsp;&nbsp;登录/注册</div>
<div class="panel" id ="panel" style="display:none;">
<div id="dlpage" style="float:left">
 <form action="action"> 
<br>
<br>
<br>
<br><pre>
   用户名:<input type="text" name="username"/><br>
   密  码:<input type="password" name="password"/><br>
   <input class="c" type="submit" value="登录" /><br>
</pre>
   </form>
</div>
<div id="zhucepage" style="float:left">
<br>
<br>
<pre>
   <form action="action2" method="post">
    用户名 :<input type="text" name="username"><br>
密    码:<input type="password" name="password"><br>
密码确认:<input type="password" name="password1"><br>
<input class="c" type="submit" value="注册"><br>
   </form>
</pre>
</div>
</div>
<br>
     <div>
如何让这部分不会随上面下拉而变化。
        </div>
 <script> 
$(document).ready(function(){
$("#dlzc").click(function(){
    $("#panel").slideToggle("slow");
  });
});
</script>
</script>
 </body>
</html>


=============
代码如上,求大神指点,如何设置才能获得我所期望的效果。
HTML jQuery

------解决方案--------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title></title>
  <style type="text/css">
    * { margin:0; padding:0;}
    .dl_b{margin:0; padding:15px;height:10px;background:#0099ff}
    .c{width:100px;height:30px}
    .panel{width:100%;height:300px;background:#8080c0}
 &n