500px 未知的html格式,显示/隐藏顶部500 px和底部500 px之间的div

我有一个页面，我希望在滚动后显示500px后我会使用＆＃34;如果你想在滚动一些像素后显示一个div，没有jquery＆＃34;来自apaul34208(show div after 800px scroll)的代码段。我改编的代码是这样的：

myID = document.getElementById("myID");

var myScrollFunc = function () {

var y = window.scrollY;

if (y >= 400) {

myID.className = "pointer show"

} else {

myID.className = "pointer hide"

}

};

window.addEventListener("scroll", myScrollFunc);

和CSS：

.hide {

display: none;

}

.show {

display: block;

margin-top: -80px;

}

唯一的问题是我还希望它再次消失，让我们从页面底部说400 px。页面高度因页面而异，所以我不能设置像下面那样的范围400-1000像素。

myID = document.getElementById("myID");

var myScrollFunc = function () {

var y = window.scrollY;

if (y >= 400 & y <= 1000 ) {

myID.className = "pointer show"

} else {

myID.className = "pointer hide"

}

};

window.addEventListener("scroll", myScrollFunc);