Wednesday, 29 April 2015

html scroll bar

below elements are document.body:

element.scrollTop - is the pixels hidden in top due to the scroll. With no scroll its value is 0.
So you can verify if your scroll bar is on the top of the screen by check element.scrollTop ==0

element.scrollHeight - is the pixels of the whole div.
element.clientHeight - is the pixels that you see in your browser.
var a  =  element.scrollTop  ;
will be the position.
var b  =  element.scrollHeight - element.clientHeight  ;
will be the maximum value for scrollTop.
var c  =  a / b  ;
will be the percent of scroll [from 0 to 1].
So, to check if your webpage need scroll or not, you can check element.scrollHeight - element.clientHeight > 0

No comments:

Post a comment