CODEWITHSUNDEEP
javascriptdomscroll
ahmed korim
ahmed korim

Reputation: 31

Why window.scrollY !== document.body.clientHeight @ maximum scroll point

Why isn't window maximum scroll equal to body height?

I am trying to do some effect with the friction between the maximum scroll and current scroll.

Upvotes: 3

Views: 1751

Answers (3)

Laura Durieux
Laura Durieux

Reputation: 61

This is because window.scrollY will give you the coordinate of the left top corner. You will see that if you add the height of the window to window.scrollY at the max scrolling point, you will have the height.

Example : My window has as an innerHeight of 599, My body has a height of 1797, The value of window.scrollY at the maximum scrolling point is 1198, If I do 1198 + 599 I obtain 1797 that is the right height of my document.

1198 + 599 = 1797

Just keep in mind that the value of window.scrollY is in the top left corner of the document.

Upvotes: 4

Chathura Widanage
Chathura Widanage

Reputation: 663

The clientHeight property returns the viewable height of an element in pixels, including padding, but not the border, scrollbar or margin.

The read-only scrollY property of the Window interface returns the number of pixels that the document is currently scrolled vertically.

Upvotes: 1

str
str

Reputation: 44969

See Element.clientHeight:

The Element.clientHeight read-only property is zero for elements with no CSS or inline layout boxes, otherwise it's the inner height of an element in pixels, including padding but not the horizontal scrollbar height, border, or margin.

clientHeight can be calculated as CSS height + CSS padding - height of horizontal scrollbar (if present).

There might be a margin assigned to the body.

Upvotes: 1

Related Questions