Javascript Scrolltop用于固定菜单位置

我想在javascript中滚动几个像素后粘贴我的菜单栏，但它没有正常工作。这是我的脚本。

JavaScript代码：

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

function stick() {
    if (document.body.scrollTop || document.documentElement.scrollTop > 150) {
        document.getElementById("test").style.position = "fixed";
        document.getElementById("test").style.background = "blue";
    } else {
        document.getElementById("test").style.position = "initial";
    }
}

问题：
每当我滚动一个像素时，我的测试id就会被修复。我试图在if中更改scrollTop值，但无效。敬请关注

更新： 这里还有一个使用ID的错误

<script>
document.getElementById("cntnr").onscroll = function() {stick()};

function stick() {
    if (document.getElementById("cntnr").scrollTop > 119) {
    document.getElementById("navdwn").style.position = "fixed";
    } else {
    document.getElementById("navdwn").style.position = "initial";
    }
}
</script>

document.getElementById（“cntnr”）.onscroll=function（）{stick（）}；
功能棒（）{
if（document.getElementById（“cntnr”）.scrollTop>119）{
document.getElementById（“navdwn”）.style.position=“fixed”；
}否则{
document.getElementById（“navdwn”）.style.position=“initial”；
}
}

试试这段代码，您需要javascript的parseInt（）函数来生成

document.documentElement.scrollTop

等于整数

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

var offset = document.documentElement.scrollTop

function stick() {
    if (parseInt(offset) > 150) {
       document.getElementById("test").style.position = "fixed";
       document.getElementById("test").style.background = "blue";
    } else {
       document.getElementById("test").style.position = "initial";
    }
}

---

试试这段代码，您需要javascript的parseInt（）函数使

document.documentElement.scrollTop

等于整数

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

var offset = document.documentElement.scrollTop

function stick() {
    if (parseInt(offset) > 150) {
       document.getElementById("test").style.position = "fixed";
       document.getElementById("test").style.background = "blue";
    } else {
       document.getElementById("test").style.position = "initial";
    }
}

---

验证您的

If

条件，以修复当前文档滚动到150px顶部的菜单

更改：

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

function stick() {
if (document.body.scrollTop > 150 ) {
    document.getElementById("test").style.position = "fixed";
    document.getElementById("test").style.background = "blue";
} else {
    document.getElementById("test").style.position = "initial";
}
}

---

验证您的

If

条件，以修复当前文档滚动到150px顶部的菜单

更改：

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

function stick() {
if (document.body.scrollTop > 150 ) {
    document.getElementById("test").style.position = "fixed";
    document.getElementById("test").style.background = "blue";
} else {
    document.getElementById("test").style.position = "initial";
}
}

---

一旦开始滚动，

document.body.scrollTop

的值将大于

0

。如果第一个条件为真，则或运算符不会检查第二个条件

因此，一旦开始滚动，第一个条件就变为true，然后测试id得到修复

---

将条件更改为

if（document.body.scrollTop>150）{..

并且它会工作。

一旦开始滚动，

document.body.scrollTop

的值将大于

0

。如果第一个条件为真，则或运算符不会检查第二个条件

因此，一旦开始滚动，第一个条件就变为true，然后测试id得到修复

---

将条件更改为

if（document.body.scrollTop>150）{..

，它会工作。

您是否尝试使用（position）absolute而不是fixed？@MalithMcR他的if条件是错误的，当他向下滚动时，总是在if条件下执行代码，为您的代码创建JSFIDLE。您是否也尝试了（position）html代码绝对而不是固定？@MalithMcR他的if条件是错误的，当他向下滚动时，总是在if条件下执行代码，为你的代码创建JSFIDLE，同时发布你的html代码。