1

我有一个 HTML 表格。没什么太花哨的。它有thead和tbody。我想知道如何使用 javascript 或 jQuery 仅将 tbody 向下移动。

编辑：所以给你一些关于我在做什么的背景。我有一张包含一些信息的表格（谁在乎它是什么）。使用 jQuery，我将标题固定到位，这样当我向下滚动时，标题仍然在位。一切正常，标题和第一行重叠的小问题。所以我需要将 tbody 的顶部向下移动。含义标题将保持原位，正文将向下移动一点，以便我可以看到表格的第一行（即标题之后的第一行）。

我想知道是否有办法用 jQuery 或 javascript 做到这一点。

4

3 回答 3

0

我暂时尝试在这里重现您的问题。当然有更好的方法来达到同样的效果，但是你有这种代码吗？不需要使用jquery来保持表头固定，所以我使用了css：

http://jsfiddle.net/LLjdk/

相关CSS：

thead {
    position: fixed;
    background: #fff;
}

table {
    margin-top: 28px
}

请注意，表格标题是固定的（随滚动而移动），并且设置了背景，以便当表格的其余部分在其后面时，它不会显示出来。最后，在表格顶部添加了一个边距以将其向下压，这样它们就不会重叠。

于 2013-10-22T14:20:54.670 回答
0

我不确定这是否是您要查找的内容，但根据您的描述，我了解到您正试图让thead始终出现在页面顶部。这是我想出的。

thead {
    position: fixed;
    top: 0;
    left: 0;
    background-color: white;
}
table {
    margin-top: 30px;
}

演示

希望它会帮助你

于 2013-10-22T14:26:57.647 回答
-1

您可以使用 jQuery 的滚动方法http://api.jquery.com/scroll/

我需要更多信息，但听起来你会做这样的事情：

$(window).scroll(function(){
    $("table").animate({marginTop: 50}, 250);
});

编辑：我知道这个答案已被认为是正确的，但似乎我误解了这个问题，正如反对票所表明的那样。我认为 OP 是在让桌子向下滑动并像标题一样保持固定之后。我建议使用滚动方法，因为这是让表格在滚动时更改位置状态的方式。

正如其他人指出的那样，您只需将表格向下推到标题的高度+所需的间距，如下所示：

table {
    margin-top: 80px;
}
于 2013-10-22T14:22:56.937 回答