在儿童div滚动父div的滚动

时间:2013-02-17 05:59:20

标签: javascript jquery html

我希望#nav位于顶部但在#nav之上有一些text.on滚动#child div我应该能够滚动正文的主滚动条那么#nav应该固定在顶部!并且应该仅滚动#child div。

继承人参考.. http://jsfiddle.net/maUYK/

  <p>text</p>
  <p>text</p>
  <p>text</p>
  <p>text</p>
        <ul id="nav">
        <li><a href="#">About Us</a></li>
        <li><a href="#">Our Products</a></li>
        <li><a href="#">FAQs</a></li>
        <li><a href="#">Contact</a></li>
        <li><a href="#">Login</a></li>
        </ul>
  <div id="child">
  <table>
        <tr><td>a</td><td>b</td><td>c</td></tr>
        <tr><td>a</td><td>b</td><td>c</td></tr>
        <tr><td>a</td><td>b</td><td>c</td></tr>
        <tr><td>a</td><td>b</td><td>c</td></tr>
        <tr><td>a</td><td>b</td><td>c</td></tr>
        <tr><td>a</td><td>b</td><td>c</td></tr>
        <tr><td>a</td><td>b</td><td>c</td></tr>
        <tr><td>a</td><td>b</td><td>c</td></tr>
         <tr><td>a</td><td>b</td><td>c</td></tr>
        <tr><td>a</td><td>b</td><td>c</td></tr>
        <tr><td>a</td><td>b</td><td>c</td></tr>
        <tr><td>a</td><td>b</td><td>c</td></tr>
  </table>
  </div>

2 个答案:

答案 0 :(得分:0)

#nav{
    position:absolute;
       top:200px;
     left:0;
     }

     #nav.fixed{
     position:fixed;
         top:10px;
        }

使用上述样式定位导航并在滚动后修复

有关信息,您可以访问此链接 - http://addyosmani.com/blog/rocketbar/

答案 1 :(得分:-1)

div的高度太大。给高度200px,没关系。

 div {
     overflow: scroll;
     height: 200px;
     width: 520px;
 }