我需要检测用户是否滚动到页面底部。如果它们在页面的底部,当我在底部添加新内容时,我会自动将它们滚动到新的底部。如果他们不在底部,他们正在阅读页面上更高的先前内容,所以我不想自动滚动他们,因为他们想呆在那里。
我如何检测用户是否滚动到页面的底部,或者他们是否在页面上滚动得更高?
我需要检测用户是否滚动到页面底部。如果它们在页面的底部,当我在底部添加新内容时,我会自动将它们滚动到新的底部。如果他们不在底部,他们正在阅读页面上更高的先前内容,所以我不想自动滚动他们,因为他们想呆在那里。
我如何检测用户是否滚动到页面的底部,或者他们是否在页面上滚动得更高?
当前回答
公认的答案对我不起作用。这是:
window.onscroll = function(ev) {
if ((window.innerHeight + window.scrollY) >= document.body.scrollHeight) {
// you're at the bottom of the page
console.log("Bottom of page");
}
};
如果您希望支持旧的浏览器(IE9),请使用别名窗口。pageYOffset有更好的支持。
其他回答
新的解决方案。
一个问题是缺少标准的主滚动元素。最近实施的文件。scrollingElement可以用来尝试克服这个问题。下面是一个跨浏览器的解决方案。
function atEnd() {
var c = [document.scrollingElement.scrollHeight, document.body.scrollHeight, document.body.offsetHeight].sort(function(a,b){return b-a}) // select longest candidate for scrollable length
return (window.innerHeight + window.scrollY + 2 >= c[0]) // compare with scroll position + some give
}
function scrolling() {
if (atEnd())
//do something
}
window.addEventListener('scroll', scrolling, {passive: true});
使用defaultView和documentElement嵌入功能代码片段:
const {defaultView} =文档; const {documentElement} =文档; const handler = evt => (() => { const hitBottom = (() => (defaultView.)innerHeight + defaultView.pageYOffset) >= documentElement.offsetHeight)(); hitBottom ? console.log(“是的”) : console.log(“不”) }); 文档。addEventListener(“滚动”,处理程序); <pre style="height:110vh;background-color:fuchsia">向下滚动</pre>
我只是在我的页面底部放置了一个小图像,加载="lazy",这样当用户向下滚动时,浏览器才会加载它。然后图像触发一个php计数器脚本,返回一个真实的图像
<img loading="lazy" src="zaehler_seitenende.php?rand=<?=rand(1,1000);?>">
<?php
@header("Location: https://domain.de/4trpx.gif");
您可以检查窗口的高度和滚动顶部的组合结果是否大于主体的结果
如果窗口。innerHeight +窗口。scroll> = document.body.scrollHeight) {}
我必须想出一种方法(在Java中),系统地向下滚动,寻找我不知道正确XPath的组件(说来话长,所以就随它去吧)。正如我刚才所说,在寻找组件时需要向下滚动,并在找到组件或到达页面底部时停止滚动。
下面的代码片段控制向下滚动到页面底部:
JavascriptExecutor js = (JavascriptExecutor) driver;
boolean found = false;
long currOffset = 0;
long oldOffset = 0;
do
{
oldOffset = currOffset;
// LOOP to seek the component using several xpath regexes removed
js.executeScript("window.scrollBy(0, 100)");
currOffset = (Long)js.executeScript("var offset = window.window.pageYOffset; return offset;");
} while (!found && (currOffset != oldOffset));
顺便说一下,在执行此代码片段之前,窗口会最大化。