在页面滚动上显示/隐藏div

Question

我有一个有很多行的表格，这会使页面滚动。桌子上面还有一些其他的内容。我想添加一个使用jQuery的功能，在页面顶部显示div，只要表格滚动到顶行消失在屏幕顶端的地方。

我假设我将添加一个位置设置为fixed的div，但是我如何知道第一行何时移动到fold之上呢？

<div id="topDiv" style="display: none; position: fixed; top: 0"></div>

<table>
<thead>
<tr>
   <th></th>
<tr>
</thead>
<tbody>
<tr>
   <td></td>
<tr>
...
</tbody>
</table>

Answer 1

这就是你要找的。粘性分区：

http://blog.yjl.im/2010/01/stick-div-at-top-after-scrolling.html

实现示例：http://www.nkhome.com/kestrel/compare-kestrels.php

Answer 2

您可以使用下面这样的内容

$(window).scroll(function(e){ 
  $el = $('#topDiv'); 
  if ($(this).scrollTop() > 200 && $el.css('position') != 'fixed'){ 
    $el.css({'position': 'fixed', 'top': '0px'}); 
  } 
});

此检查窗口是否滚动超过200px并修复topDiv