Geek Answers Handbook

How to disable scrollbars using JavaScript?

I need to block the browser scrollbars when I show the div, which is a modal window only in Internet Explorer 7. Googling I found that I can use document.body.style.overflow='hidden' , but this does not work for IE7. I also tried to work with document.body.scroll="no" , but only after I hovered over the scroll bar: -S

Does anyone know better aproach?

Thansks

+4
source share
4 answers

To answer your various questions (including in another comment), I think that you are using the wrong positioning method.

Try position:fixed . It is basically the same as position:absolute , except for it relative to the absolute viewport. That is: if the user scrolls, the item remains in the same place on the screen.

So, bearing in mind, you can lay out the overlay position:fixed . In this case, you can have position:absolute (or fixed again, if you want - it should not matter) a modal field.

+13
source

Set your modal overlay div to fill the body, so even if they scroll there nothing they can do, because everything is hidden under it.

+2
source

you can also hide scrollbars using overflow:hidden so that the user does not see the scollbars, so he was not tempted to twist :)

0
source

This may help you:

 documentOBJ = { /*Width and Height of the avaible viewport, what you'r seeing*/ window : { x : function(){return (document.documentElement && document.documentElement.clientWidth) || window.innerWidth || self.innerWidth || document.body.clientWidth; }, y : function(){return (document.documentElement && document.documentElement.clientHeight) || window.innerHeight || self.innerHeight || document.body.clientHeight;} }, /*Scroll offset*/ scroll : { x : function(){return ( document.documentElement && document.documentElement.scrollLeft) || window.pageXOffset || self.pageXOffset || document.body.scrollLeft; }, y : function(){return ( document.documentElement && document.documentElement.scrollTop) || window.pageYOffset || self.pageYOffset || document.body.scrollTop; } }, /*Height and width of the total of the xhtml in a page*/ page : { x : function(){return (document.documentElement && document.documentElement.scrollWidth) ? document.documentElement.scrollWidth : (document.body.scrollWidth > document.body.offsetWidth) ? document.body.scrollWidth : document.body.offsetWidth; }, y : function(){return (document.documentElement && document.documentElement.scrollHeight) ? document.documentElement.scrollHeight : (document.body.scrollHeight > document.body.offsetHeight) ? document.body.scrollHeight : document.body.offsetHeight; } }, pointer : {} }
0
source

More articles:


All Articles