javascript - window.pageYOffset 在 Chrome 中不起作用

Question

所以我绝对是 js 的初学者，这可能很简单，但我不知道为什么这不起作用。 我试图在页面 Y 偏移大于 30 时显示一个 div，但它不起作用。

//js在下面

var x = document.getElementById('play');
var ypos = window.pageYOffset;

var see = function() {
    if (ypos > 30) {

    x.style.opacity = 1;

    } else {

        console.log('not working');
    }
}

window.addEventListener("scroll", see);

Answer 1

因为初始 ypos 是 0。它不会更新。无论你向下滚动多少，它始终保持为零。要更新它，它应该在 see() 函数内。所以每次向下滚动时窗口，它将被更新。并且它正在工作。不要将它与“不工作”语句混淆。这只是因为，ypos 变量被分配给相同的“0"值。请参阅我的示例。我已更改它。当 ypos>30

时，它会将不透明度设置为 0.4

var x = document.getElementById('play');


var see = function() {
var ypos = window.pageYOffset;
    if (ypos > 30) {

    x.style.opacity = '0.4';

    } else {

        alert('scrolled more than 30 !!');
    }
}

window.addEventListener("scroll", see);

<div style='width:600px;height:2000px;background:red;border:1px solid black;' id='play'>lol</div>