Конец страницы скролл
Мне необходимо вызвать событие когда пользователь докрутит страницу до самого низа, как определить что пользователь достиг конца документа?
На чистом JS необходимо! |
|
onscroll = function(){
if(window.scrollY+1 >= document.documentElement.scrollHeight-document.documentElement.clientHeight) alert('Конец прокрутки');
};
|
j0hnik,
:) а если DOCTYPE забудут или window.scrollY меньше scrollМах или ie ? |
onscroll = function(){
var scrollHeight = Math.max(
document.body.scrollHeight, document.documentElement.scrollHeight,
document.body.offsetHeight, document.documentElement.offsetHeight,
document.body.clientHeight, document.documentElement.clientHeight
);
if(window.scrollY+1 >= scrollHeight - innerHeight) alert('Конец прокрутки');
};
рони, |
j0hnik,
сделай макет, открой в браузере, снизу открой консоль, проверь работу скрипта. |
Цитата:
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body style="height: 3000px">
<script>
onscroll = function(){
var scrollHeight = Math.max(
document.body.scrollHeight, document.documentElement.scrollHeight,
document.body.offsetHeight, document.documentElement.offsetHeight,
document.body.clientHeight, document.documentElement.clientHeight
);
if(window.scrollY >= scrollHeight - innerHeight) alert('Конец прокрутки');
};
</script>
</body>
</html>
таки работает, в каком браузере у вас проблемы? |
Цитата:
|
странно, у меня все ровно тоже во всех.
давайте разбираться друг мой )) какая версия ОС и версии браузеров? с кодом выше что нибудь делали? |
j0hnik,
Windows 10 версия 1803, браузеры последние версии, пост №7, алерта нет в конце прокрутки. напишите, если не трудно, у кого-то ещё работает это? |
:cray:
Народ хелп! |
j0hnik,
в Edge работает, Firefox 61, Google Chrome 67, ie 11 - не работает |
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body style="height: 3000px">
<script>
onscroll = function(){
var scrollHeight = Math.max(
document.body.scrollHeight, document.documentElement.scrollHeight,
document.body.offsetHeight, document.documentElement.offsetHeight,
document.body.clientHeight, document.documentElement.clientHeight
);
console.log(window.scrollY - scrollHeight + innerHeight) ;
};
</script>
</body>
</html>
рони, какая цифра последняя? |
j0hnik,
-0.39990234375 |
рони,
Кажись понял в чем проблема Либо из за масштаба страницы или разрешения экрана. У меня только так дробные появляются. |
Цитата:
Цитата:
if(window.scrollY + 5 >= scrollHeight - innerHeight) |
рони,
Не любите вы мелкий текст, у вас масштаб 125% =) угадал? |
j0hnik,
я люблю кроссбраузерный код! :) |
Цитата:
|
рони,
я ошибся 250% машстаб у вас :blink: |
поправил посты на всякий случай
|
Цитата:
|
Здравствуйте!
Подскажите пожалуйста, почему alert срабатывает тогда, когда ползунок вверху? Как сделать, чтоб было наоборот?
$(window).scroll(function()
{
if ($(window).scrollTop() <= $(document).height() - $(window).height())
{
alert('Пользователь долистал до низа страницы');
}
});
|
if ($(window).scrollTop() >= $(document).height() - $(window).height())
|
Цитата:
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
body{
height: 3000px;
}
</style>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>
<script>
$(window).scroll(function() {
if ($(window).scrollTop() >= $(document).height() - $(window).height())
{
alert('Пользователь долистал до низа страницы');
}
});
</script>
</body>
</html>
в каком браузере? |
или нужно чтобы раз сработал, а повторно при прокрутке до низа не срабатывал?
|
Цитата:
|
DDim1000,
26 пост у вас правильно работает? |
Цитата:
https://youtu.be/BnM6D-gHlao |
DDim1000,
если сам пост правильно, дело в чем то другом |
Цитата:
|
Цитата:
|
сайт напишите, гляну
|
Цитата:
|
| Часовой пояс GMT +3, время: 13:19. |