В этой статье описывается метод JS, чтобы определить, достиг ли полоса прокрутки нижней или верхней части страницы. Поделитесь этим для вашей ссылки. Конкретный анализ заключается в следующем:
Мы часто видим, что многие веб -сайты возвращаются к верхнему эффекту, заключается в том, что когда мы прокручиваем планку до указанной позиции, он вернется к вершине, в противном случае он будет автоматически скрыт. Позвольте мне представить принципы и методы реализации этого эффекта.
Когда видимая область меньше фактической высоты страницы, определяется, что появляется полоса прокрутки, то есть:
Кода -копия выглядит следующим образом: if (document.documentelement.clientheight <document.documentelement.offsetheight) scroll = true;
Чтобы использовать Document.documentelement, вы должны добавить объявление в начале страницы:
Скопируйте код следующим образом: <! Doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
На самом деле, этот код не работает, потому что он не рассматривал проблему, то есть границу браузера. Когда мы получаем высоту страницы, он включает в себя границу браузера. Граница браузера составляет 2 пикселя, поэтому в любом случае ClientHeight всегда меньше, чем OffSetheight, что делает его правдой даже без полосы прокрутки. Поэтому нам нужно исправить эту ошибку. Код должен быть изменен таким образом и вычесть 4 пикселя в Offsetheight, то есть:
Скопируйте код кода следующим образом: if (document.documentelement.clientheight <document.documentelement.offsetheight-4) {
// выполнить связанные сценарии.
}
Кроме того, нам нужно выяснить это, что вышеуказанный кодекс судит горизонтальную полосу прокрутки. Нам, как правило, нужно судить о вертикальной свитке, кодекс заключается в следующем:
Скопируйте код следующим образом: if (document.documentelement.clientwidth <document.documentelement.offsetwidth-4) {
// выполнить связанные сценарии.
}
Чтобы определить, была ли полоса прокрутки до конца страницы, вы можете использовать следующий код
Скопируйте код следующим образом: window.onscroll = function () {
var marginbot = 0;
if (document.documentelement.scrolltop) {
marginbot = document.documentelement.scrollheight (document.documentelement.scrolltop+document.body.scrolltop) -document.documentelement.clientHeight;
} еще {
marginbot = document.body.scrollheight document.body.scrolltop- document.body.clientheight;
}
if (marginbot <= 0) {
// что -нибудь делай
}
}
Пример 2
Ищу это в Интернете. Очень браузер совместим. Как ни странно, я не нашел никакой соответствующей информации в документе. Разместите код.
Скопируйте код следующим образом:/*******************************
* Взять высоту полосы прокрутки окна
*********************/
Функция getScrolltop ()
{
var scrolltop = 0;
if (document.documentelement && document.documentelement.scrolltop)
{
scrolltop = document.documentelement.scrolltop;
}
иначе if (document.body)
{
scrolltop = document.body.scrolltop;
}
вернуть Scrolltop;
}
/*************************
* Возьмите высоту визуального диапазона окна
*************************/
функция getClientHeight ()
{
var clientHeight = 0;
if (document.body.clientheight && document.documentelement.clientheight)
{
var clientHeight = (document.body.clientHeight <document.documentelement.clientheight)? Document.Body.ClientHeight: Document.DocumentElement.ClientHeight;
}
еще
{
var clientHeight = (document.body.clientheight> document.documentelement.clientheight)? Document.body.clientHeight: document.documentelement.clientHeight;
}
вернуть клиент -вершина;
}
/*************************
* Возьмите фактическую высоту содержания документа
*************************/
Функция getScrollheight ()
{
return math.max (document.body.scrollheight, document.documentelement.scrollheight);
}
функциональный тест () {
if (gescrolltop ()+getClientHeight () == getScrollheight ()) {
оповещение («добраться до дна»);
}еще{
оповещение («не достиг дна»);
}
}
Пополнить:
DTD заявил:
Т.е.
document.documentelement.scrollheight Всего контента высота браузера, document.body.scrollheight Весь контент высота браузера
document.documentelement.scrolltop Брусная высота части прокрутки в браузере, document.body.scrolltop всегда 0
document.documentelement.clientHeight видимая высота части браузера, документ.
Фф
document.documentelement.scrollheight Всего контента высота браузера, document.body.scrollheight Весь контент высота браузера
document.documentelement.scrolltop Брусная высота части прокрутки в браузере, document.body.scrolltop всегда 0
document.documentelement.clientHeight видимая высота части браузера, документ.
Хром
document.documentelement.scrollheight Всего контента высота браузера, document.body.scrollheight Весь контент высота браузера
document.documentelement.scrolltop всегда 0, document.body.scrolltop Browser Высота прокрутки части.
document.documentelement.clientHeight видимая высота части браузера, документ.
DTD не объявлен:
Т.е.
Document.documentelement.scrollheight Высота видимой части браузера, document.body.scrollheight Высота всего содержания браузера
document.documentelement.scrolltop всегда 0, document.body.scrolltop Browser Высота прокрутки части.
document.documentelement.clientHeight всегда 0, Document.Body.ClientHeight Видимая высота части браузера
Фф
Document.documentelement.scrollheight Высота видимой части браузера, document.body.scrollheight Высота всего содержания браузера
document.documentelement.scrolltop всегда 0, document.body.scrolltop Browser Высота прокрутки части.
document.documentelement.clientHeight Высота всего содержания браузера, Document.Body.ClientHeight Высота видимой части браузера
Хром
Document.documentelement.scrollheight Высота видимой части браузера, document.body.scrollheight Высота всего содержания браузера
document.documentelement.scrolltop всегда 0, document.body.scrolltop Browser Высота прокрутки части.
document.documentelement.clientHeight Высота всего содержания браузера, Document.Body.ClientHeight Высота видимой части браузера
Высота всего содержания браузера - это высота всей структуры браузера, в том числе сумма высоты калковой части прокрутки + визуальная часть + скрытая часть внизу
Высота прокрутки браузера - это высота штуковины, выталкивая часть высоты, чтобы увидеть высоту вершины всего объекта.
После понимания приведенных выше параметров мы можем создать эффект прокрутки, который совместим с IE, FF и Chrome Browsers.
Я надеюсь, что эта статья будет полезна для каждого программирования JavaScript.