Javascript 香草酱？

我正在尝试创建一个脚本，当页面滚动时，无论div在屏幕上的什么位置，它都会将div固定在它们的位置上。。。基本上，如果一个div距离顶部50 px，它将保持距离当前窗口顶部50 px。如果div距离顶部为0 px，它将保持距离顶部为0 px

---

我不想要一个固定的div，因为他们有截止问题。。。因此，请不要建议将位置更改为“位置：固定；”

我正在使用的脚本基本上执行以下操作：

window.onscroll = function() {

    var elements = document.getElementsByClassName('sticky_div');
    var doc = document.documentElement;

    for (i = 0; i < elements.length; i++) {
        rect = elements[i].getBoundingClientRect();

        if (doc.scrollTop > rect.top) {
            elements.style.top = doc.scrollTop + rect.top;
        } else {
            elements.style.top - doc.scrollTop - rect.top;
        }
    }
}

window.onscroll=function（）{
var elements=document.getElementsByClassName（'sticky_div'）；
var doc=document.documentElement；
对于（i=0；irect.top）{
elements.style.top=doc.scrollTop+rect.top；
}否则{
elements.style.top-doc.scrollTop-rect.top；
}
}
}

如果这真的是错的，我很抱歉。我不小心删除了我的原始代码。。。无论哪种方式，上面的方法都会导致太长时间，并且会跳转header和div。是否有其他方法可以使用较少的顶层处理来实现这一点

elements.style.top=doc.scrollTop；工作非常好，但它不允许div位于页面的其他位置

下面是一个JSFIDLE，解释我不想使用固定div的原因（尝试水平滚动）：

---

您是否考虑过只使用css和

位置：fixed

？fixed元素的“截止问题”是什么？“我不想要固定div，因为它们有截止问题…”我很好奇，您的用例是什么，它会阻止您使用

位置：fixed

？如果屏幕大小调整到元素溢出屏幕的位置，那么固定元素将不会水平滚动，这是我所需要的。其他时候，我试着使用它，让它以绝对元素和固定元素的混合方式滚动，它会在默认的窗口视口后切断所有内容。。。如果是那样的话，有什么办法吗？我不太明白。您是否可以更新您的问题以添加一些图像或模型，以及您希望避免的固定元素发生的情况，以及期望的结果是什么？