我有一个基于 vh 的网站，其中包含我想要在滚动某个 vh 时显示的元素。我尝试使用带有滚动距离变量的 if 语句，但它不会不断更新，因此不起作用:
var distancePX = $(window).scrollTop();
var windowHeight = $(window).height();
var distanceVH = scroll/height * 100;
if (distance >= 170) {
//ACTIONS
};
我可以使用什么来制作上述版本的不断更新版本？
最佳答案
使用纯 JS，您可以使用 onscroll 事件并将其绑定(bind)到正文。这是一个例子:
HTML
<body onscroll="myFunction()">
...
</body>
JS
var distancePX = $(window).scrollTop();
var windowHeight = $(window).height();
var distanceVH = scroll/height * 100;
function myFunction() {
if (distance >= 170) {
//ACTIONS
}
}
如果您更喜欢非标记解决方案，您还可以使用 jQuery 的 scroll() 方法。使用此方法，您只需将 if 语句放入 scroll() 函数中即可。这是一个例子:
var distancePX = $(window).scrollTop();
var windowHeight = $(window).height();
var distanceVH = scroll/height * 100;
$("body").scroll(function(){
if (distance >= 170) {
//ACTIONS
}
});
希望这有帮助!
关于javascript - 达到一定滚动距离时触发事件 jQuery，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43573245/