Как получить позицию скроллбара от нижней границы дива в jQuery?

Question

[Mirgorod]

Здравствуйте, хотелось бы узнать как можно получить позицию скроллбара от нижней границы дива, а не от верхней.



Например есть такой код:

pastebin.com/b0SFd7LW



И я хочу сделать так, чтобы, если позиция скролла от нижней границы меньше 100px, то делать скролл вниз.

scrollTop не подходит, так как даже, если я знаю позицию от верхней границы и высоту самого блока, то я не знаю высоту скроллбара (не знаю как её получить).



Как же всё таки можно получить позицию от нижней границы?



Заранее спасибо.

Answer 1

[krasulya]

Для этого нужно знать высоту содержимого этого div'а. В таком случае:

var scrollBottom = $('#inner').height() - $('#outer').height() - $('#outer').scrollTop();

Пример jsfiddle.net/4RkqP/

Если нет такого элемента, как #inner (т.е. узнать высоту содержимого не так просто), то нужно создать клон div'a, сделать его css height равной auto, а потом, с помощью яваскрипта узнать его высоту. И сделать так, как описано выше.

Пример jsfiddle.net/a47tX/

Comments

[Mirgorod]

большое спасибо!

Answer 2

[Олег Яковенко]

Тривиальный пример без никаких фреймворков и прочего (пишу по памяти). Plain js:

var Y = document.getElementById("mydiv").scrollTop;
Добавляем высоту дива, и отнимаем это дела от document.documentElement.offsetHeight (IE) или window.innerHeight (для человеческих браузеров). И вешаем эту свою логику в обработчик скролла.

Но советую если есть js фреймворк то доставать высоту окна при помощи него, чтобы наверняка получать нормальное значение

Comments

[Mirgorod]

jquery и не высота окна, а дива.

[Mirgorod]

Не работает.
$(messagesBlock).scrollTop($(messagesBlock).height());
var result = ($(messagesBlock).scrollTop() + $(messagesBlock).height()) - $(messagesBlock).innerHeight();
alert(result);
Должно быть всегда 0, но это не так.

[Олег Яковенко]

Тогда можно попробовать ещё так
var y2 = document.getElementById('d2').offsetTop;
у меня вроде работает на моём примерчике