gpt4 book ai didi

javascript - 滚动期间需要固定表格

转载 作者:行者123 更新时间:2023-11-28 17:51:53 25 4
gpt4 key购买 nike

我有 3 个表,其中一个我想在滚动超过特定距离后修复

    var distance = $("#thead").offset().top;
$(window).scroll(function () {
var wdistance = $(window).scrollTop();
if (wdistance > distance) {

};
})

演示 jsfiddle

我想说的是,如果这个“if”是正确的,那么在滚动页面时,id 为“thead”的 div 的位置将固定在其他表格的顶部。然后在 ID 为“first”的 div 完成后 <div id="thead"></div>回到原来的地方。

最佳答案

您可以创建一个 .fixed类并将其添加到/从 #thead 中删除元素,如下:

CSS

* { padding: 0; margin: 0; } /* Tiny reset for removing paddings and margins */

.fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
}

请注意,您必须从 <body> 中删除填充/边距元素调整每列的宽度(当 #thead 被定位时)。

或者对定位的 #thead 使用相同的填充/边距元素也是如此。

var $table = $("#thead"),
$window = $(window),
distance = $table.offset().top;

$window.scroll(function () {
var wdistance = $window.scrollTop();

if (wdistance > distance) {
$table.addClass('fixed');
} else {
$table.removeClass('fixed');
}
});

WORKING DEMO .

关于javascript - 滚动期间需要固定表格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22125596/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com