Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Westi on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

How can I temporarily disable and gray out the page scroll-bars in IE?

Status
Not open for further replies.

willj49

Programmer
Jan 3, 2005
7
US
I have a page with enough HTML content to make vertical scroll-bars necessary. I have a case on this page where a pop-up div that is displayed via JavaScript shows up. When this happens I want to disable the scroll-bars to prevent scrolling, but I do not want to hide them. Then after something is clicked in this div, the div will hide and the scroll-bars should be re-enabled as normal. I've tried setting style="overflow: hidden;" on my body tag and "scrolling: no", but these completely remove the scroll bars rather than just disabling them. I know normally in IE when there isn't enough page content to need the vertical scroll bar, it will still show only be disabled, so I would think since using "overflow: hidden;" clips the excess content this would be the case, but unfortunately that is not what is occurring by default. (Note that I am only concerned with making this work on Internet Explorer.)

If you navigate to most likely their page will fit on your screen without a scroll bar and you will see a grayed out vertical scroll bar on the right hand side, this is what I want on my page only when the page content is so much so that the scrollbar isn't grayed out initially. I just want to hide the excess (or overflow) content and then temporarily gray out but not remove the scroll bar to the right.

Help on this is appreciated, thanks.
 
1. Which browser(s) do you need this to work on? With FF, you do not see scroll bars unless you need them. In IE, you always see them. This matters for what you want.

2. You want to always show the scroll bars disabled no matter what? So even if the page needs them to view content, you don't want the user to see it? May I ask why?
 

1. I want this to work on IE only. I don't care about how it works on other browsers.

2. I don't want to always show the scroll bars disabled no matter what. This isn't what I meant to say. Sorry, I wasn't clear, I'll try to explain my situation better...

Initially, I want the scroll bars to show up enabled as they normally would when my page is first loaded. On my page I have a button that the user may click. If the user clicks this button I then set the visibility of a previously hidden div to be visible. This div is like a small embedded window that also contains OK and Cancel buttons in it. When this div is visible I want the vertical scroll bar on the right of the IE page to switch from being enabled to being disabled, but still be present. This should effectively disable any scrolling temporarily. As soon as the user clicks OK or Cancel on my div the div will go back to being hidden and I want the scroll bars to go back to being enabled. I have managed to get it to where I can make the scroll bar completely disappear when the div is visible by executing the following line of code:
Code:
document.body.style.overflow = "hidden";
Then I can make the scroll bar reappear when the div is hidden again by executing this code:
Code:
document.body.style.overflow = "auto";
Unfortunately, though, this isn't really what I want. I'd really like it to stay visible but just be grayed out and not respond to mouse events when the user clicks on it until the div's OK or Cancel button is clicked.

Thanks for your interest...

 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top