将 JavaScript 滚动顶部更改为 id 或 class 而不是 body

Question

我有一个固定在页面顶部的侧边菜单。我可以将其更改为 div、呼叫或 ID，而不是使用 body 来告诉位置。

我现在的代码 这段代码告诉侧边菜单根据 class 定位自己，一旦我从页面顶部滚动 40px，我如何更改它，使其从 ID 或 class?[=14 变为 40px =]

 window.onscroll = function () {onScrollNav()};

function onScrollNav() {
   if (document.body.scrollTop > 40 || document.documentElement.scrollTop > 40) {
        document.getElementById("mySidenav").className = "sidenavScroll";
        console.log("you hit 40px !!");
    } else {
        document.getElementById("mySidenav").className = "sidenavScrollReset";
        console.log("you back to 0 !!");
    }
}

Answer 1

我认为最好的办法是获取滚动位置、具有相关 ID 的元素的偏移量，最后进行一些快速计算。

var elOffset = document.getElementById('<ID HERE>').getBoundingClientRect();
function onScrollNav() {
    var diff = (document.documentElement.scrollTop - elOffset.top);
    if (diff > 40) {
        document.getElementById("mySidenav").className = "sidenavScroll";
        console.log("you hit 40px offset from the element with ID!!");
    } else {
        document.getElementById("mySidenav").className = "sidenavScrollReset";
        console.log("you back to 0 !!");
    }
}

将 JavaScript 滚动顶部更改为 id 或 class 而不是 body

Change JavaScript scroll top to a id or class rather than body

javascript

actionscript-2

onscroll

onscrolllistener