Menu
Is there a way to determine the max scroll position for every browser, without actually scrolling to the end and reading this position?
Taken a container div with a fixed height and overflow. Several div elements in the container whose sum of heights is bigger then the height of the container.
There is a max scroll position (y) which I thought is simply the container-height minus the total items-height. This seems to be true until the line-height of the container is larger then the height of the items. If this is the case, it seems that every browser determines the max scroll position differently.
With padding it got even worse, some browsers add the top padding, some browsers add both top and bottom padding.
See this fiddle for example. Play around with the container line-height and the div.item height.
561
To get the height of the scroll bar the offsetHeight of div is subtracted from the clientHeight of div. OffsetHeight = Height of an element + Scrollbar Height. ClientHeight = Height of an element. Height of scrollbar = offsetHeight – clientHeight.
To get or set the scroll position of an element, you follow these steps: First, select the element using the selecting methods such as querySelector() . Second, access the scroll position of the element via the scrollLeft and scrollTop properties.
innerHeight + window. pageYOffset) >= document. body. offsetHeight) { alert("you're at the bottom of the page"); } };
The scrollTop() method sets or returns the vertical scrollbar position for the selected elements.
I only have the ability to test in a handful of browsers, but I think what you are looking for is:
elm.scrollHeight - elm.clientHeight
Shown in an updated jsFiddle.
104
Take a look at this How to find the HTML element Scrollable Height and width using JQuery ?, this shows how to get the scrollable height and width, and there is some related posts regarding element scroll how to check if the scrollbars are currently visible? and how to determine if the vertical and horizontal scrollbars reaches the edges?. and there are more FAQs available and i hope this will help you !.
30
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
