Как получить максимальное значение scrolltop документа - программирование
Подтвердить что ты не робот

Как получить максимальное значение scrolltop документа

Я делаю плагин, и мне нужно получить максимальный scrollTop значение документа. Максимальное значение scrollTop равно 2001, но $(document).height() возвращает 2668 и $('body')[0].scrollHeight дает мне undefined.

Как получить 2001 через javascript/jquery?!

4b9b3361

Ответ 1

Код в ваших комментариях должен работать:

$(document).height() - $(window).height()

Вот пример, который предупреждает о прокрутке до максимальной позиции прокрутки: http://jsfiddle.net/DWn7Z/

Ответ 2

Если вы хотите "угадать" максимальное значение scrolltop, возможно, вам следует сравнить высоту документа и высоту видового экрана (размер вашего окна).

/**
 * Return a viewport object (width and height)
 */
function viewport()
{
    var e = window, a = 'inner';
    if (!('innerWidth' in window))
    {
        a = 'client';
        e = document.documentElement || document.body;
    }
    return { width : e[ a+'Width' ] , height : e[ a+'Height' ] }
}

// Retrieve the height of the document, including padding, margin and border
var documentHeight = $(document).outerheight(true);
var viewPortData = viewport();

var maxScrollTop = documentHeight - viewPortData.height;

Конечно, в вашем плагине вы также должны добавить слушателя в событие изменения размера и пересчитать максимальный scrollTop.

Ответ 3

В ваниле Javascript Я сейчас делаю это:

getScrollTopMax = function () {
  var ref;
  return (ref = document.scrollingElement.scrollTopMax) != null
      ? ref
      : (document.scrollingElement.scrollHeight - document.documentElement.clientHeight);
};

Это возвращает Gecko нестандартный scrollTopMax, если он существует, иначе вычисляет его. Я использую document.scrollingElement здесь, который существует только в определенных браузерах, но легко polyfill.

Ответ 4

Вот ответ, который я написал fooobar.com/info/179243/..., о polyfill для scrollTopMax, который является родным свойством для объектов Element. (только мозилла). Посмотрите на ответ, вам действительно может понравиться.

Пыль просто быстрый фрагмент. Ответ в ссылке более богат (обязательно посмотрите).

(function(elmProto){
    if ('scrollTopMax' in elmProto) {
        return;
    }
    Object.defineProperties(elmProto, {
        'scrollTopMax': {
            get: function scrollTopMax() {
              return this.scrollHeight - this.clientTop;
            }
        },
        'scrollLeftMax': {
            get: function scrollLeftMax() {
              return this.scrollWidth - this.clientLeft;
            }
        }
    });
}
)(Element.prototype);

используйте пример:

var el = document.getElementById('el1');
var max = el.scrollLeftMax;