在 Js 或 Jquery 中选择已滚动到窗口顶部的元素

Question

我在这里有 8 个可折叠部分的链接列表。 我希望该部分的标题/切换器具有粘性或保留在视口中，但让正文滚动。当下一个标题出现时，上一个标题应该滚动到它的正文，下一个标题将停留在页面顶部，依此类推，反转类似的事情。

它使用 CSS 属性工作正常position: sticky但在某些浏览器上它不起作用.

现在我需要选择窗口顶部的元素。 并使用JS或Jquery为其添加position: fixed样式。

分享下面的代码只是为了理解，否则它不起作用..

$(".collapsible").on('scroll', function(event) {
if(event.target.offset().top() === $window.scrollTop()) {
console.log(event.target);
}
});

如果您有任何解决方案，请与我分享。

Answer 1

在this.classList.toggle("active");后添加以下行：

var $top = this.offsetTop;
setTimeout(function() {
window.scrollTo({
top: $top,
behavior: "smooth"
});
}, 200);