How to disable scrollbars with JavaScript?

Question

I need to lock the browser scrollbars when I show a div that represent a modal window in Internet Explorer 7 only. Googling I found that I can use document.body.style.overflow='hidden' but this doesn't work for IE7. I also tried with document.body.scroll="no" which works but only after I mouse over the scrollbar :-S

Does anybody knows a better aproach?

Thansks

Answer 1

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

Try position:fixed. It's basically the same as position:absolute apart from it's relative to the absolute viewport. Ie: if the user scrolls, the item stays in the same place on the screen.

So with this in mind, you can lay out a position:fixed overlay. Within that you can have your position:absolute (or fixed again, if you prefer -- it shouldn't make a difference) modal box.