find height of vertical scroll bar in IE

[wolverine]

Hi,
Is there any way to find the height of vertical scroll bar with
out moving the scroll bar in IE ?

Thanks in Advance
Kiran.

 

[David Mark]

Hi,
Is there any way to find the height of vertical scroll bar with
out moving the scroll bar in IE ?

Not sure exactly what you mean by that. If you want to find out what
percentage of the page's height is visible, the clientHeight and
scrollHeight properties of the body (documentElement in standards
mode) element will be of interest.

 

[wolverine]

Not sure exactly what you mean by that. If you want to find out what
percentage of the page's height is visible, the clientHeight and
scrollHeight properties of the body (documentElement in standards
mode) element will be of interest.

Actually my aim to find the scroll percentage in IE. To be more clear,
if i move the scroll bar from page top to page bottom, i should get
100% scroll. If i move scroll bar from page top to page middle, i
should get 50%. I use the code below

var docElem = document.documentElement;
var scrollHeight = docElem.scrollHeight;
var vScrollDiff = docElem.scrollTop - lastScrollTop; //assume i save
the last scroll top position
var vScrollPercentage = (Math.abs(vScrollDiff )/scrollHeight) * 100;

But the problem is the 'vScrollPercentage' never comes to 100% even if
scroll down to page bottom since

scrollHeight = scrollTop + 'height of vertical scroll bar' (assuming
scroll bar hit page bottom).

So if i can find height of vertical scroll bar, i would modify the
last line as

var vScrollPercentage = ( (Math.abs(vScrollDiff) +
scrollBarHeight) / scrollHeight) * 100;


Could any one help me on this ?

Thanks
Kiran

 

[David Mark]

Actually my aim to find the scroll percentage in IE. To be more clear,
if i move the scroll bar from page top to page bottom, i should get
100% scroll. If i move scroll bar from page top to page middle, i
should get 50%. I use the code below

var docElem = document.documentElement;
var scrollHeight = docElem.scrollHeight;
var vScrollDiff = docElem.scrollTop - lastScrollTop; //assume i save
the last scroll top position
var vScrollPercentage = (Math.abs(vScrollDiff )/scrollHeight) * 100;

But the problem is the 'vScrollPercentage' never comes to 100% even if
scroll down to page bottom since

scrollHeight = scrollTop + 'height of vertical scroll bar' (assuming
scroll bar hit page bottom).

So if i can find height of vertical scroll bar, i would modify the
last line as

var vScrollPercentage = ( (Math.abs(vScrollDiff) +
scrollBarHeight) / scrollHeight) * 100;

Could any one help me on this ?

Quirks mode:

(document.body.scrollTop / (document.body.scrollHeight -
document.body.clientHeight) * 100)

Standards mode:

(document.documentElement.scrollTop /
(document.documentElement.scrollHeight -
document.documentElement.clientHeight) * 100)

 

[wolverine]

Quirks mode:

(document.body.scrollTop / (document.body.scrollHeight -
document.body.clientHeight) * 100)

Standards mode:

(document.documentElement.scrollTop /
(document.documentElement.scrollHeight -
document.documentElement.clientHeight) * 100)

Thanks a lot for the help. But in IE6 the equation for standards mode
is not working. But quirks mode equation worked. Why ? Once more
Thanks a lot.

 

[David Mark]

Thanks a lot for the help. But in IE6 the equation for standards mode
is not working. But quirks mode equation worked. Why ? Once more

It sounds like you aren't testing it in standards mode. Post your
source.

 

[wolverine]

It sounds like you aren't testing it in standards mode. Post your
source.

The code is 2000 lines long. So i cannot post it here. Could you
please tell how to determine whether the browser is in standard or
quirks mode ? Can i determine that using javascript ?

 

[David Mark]

The code is 2000 lines long. So i cannot post it here. Could you

Only need to see the first line. And if the quirks version worked and
the standards version didn't then I don't really need to see it
anything.

please tell how to determine whether the browser is in standard or
quirks mode ? Can i determine that using javascript ?

Yes. Quirks mode is:

(document.compatMode == 'BackCompat')

Standards mode is:

(document.compatMode == 'CSS1Compat')

Realize that this not a complete feature test as not all browsers
support this property (or documentElement.) In other words, you
should check if documentElement exists before attempting to reference
its properties.