Question

https://rebecca-milazzo-test.squarespace.com/featured#/btr/

我将页面元数据设置为固定定位，但是当用户滚动时，div不会停止并在页面底部的缩略图下滚动。我已经研究过其他脚本，但它们都是为了在某个像素高度停止div而不是另一个元素。

非常感谢任何帮助。

Answer 1

您将要创建一个检查窗口滚动位置的功能，以查看您是否已滚动到缩略图部分。当您滚动到缩略图部分时，将固定元素位置设置为绝对，并将其顶部设置为窗口滚动位置加上原始顶部值。对于像我这样认为z-index足够的人，OP不希望该元素在缩略图部分下方或滚动缩略图部分上方。

function checkposition(){
    fixedelement = document.querySelector(".project-meta");
    stopelement = document.querySelector("#project-thumbs");
    stoppoint = stopelement.scrollTop - fixedelement.clientHeight - parseInt(fixedelement.style.top);
    if (window.scrollY >= stoppoint){
        fixedelement.style.position = "absolute";
        fixedelement.style.top = [defaulttophere] + window.scrollY + "px";
    } else {
        fixedelement.style.position = "fixed";
        fixedelement.style.top = [defaulttophere];
    }
}

window.addEventListener("scroll", checkposition);

让我知道这是否有效，我很快就把它扔了。

用于阻止固定div在另一个div下滚动的脚本？

1 个答案: