Solved

How to cover browser scroll bar with an overlay

Posted on 2011-03-10
7
570 Views
Last Modified: 2012-05-11

Hi Experts!

I would like to be able to cover the browser scroll bar when I use an overlay. It should work from IE6 +. How one can do this?

Thanks
0
Comment
Question by:dlcnet
  • 4
  • 3
7 Comments
 
LVL 7

Expert Comment

by:Gene_Cyp
ID: 35094029
Hmm, not fully sure what you are trying to achieve?

You have a page that has a VERTICAL scrollbar and you wish to hide that scrollbar using an overlay?
0
 

Author Comment

by:dlcnet
ID: 35094209
@Gene_Cyp:

yes
0
 
LVL 7

Expert Comment

by:Gene_Cyp
ID: 35094325
Is this scrollbar in an iframe or the actual main page?
0
Best Practices: Disaster Recovery Testing

Besides backup, any IT division should have a disaster recovery plan. You will find a few tips below relating to the development of such a plan and to what issues one should pay special attention in the course of backup planning.

 

Author Comment

by:dlcnet
ID: 35094338
@Gene_Cyp:

is the actual page. I would like to block the browser view-port including scroll bars
0
 
LVL 7

Accepted Solution

by:
Gene_Cyp earned 500 total points
ID: 35094448
Add this to your CSS file:

html, body { overflow: hidden; }


Or if you are putting your CSS as a script text inside the html page:

<style type="text/css">
html, body { overflow:auto }
</style>

But you are aware that hiding your scrollbar means you'll be unable to view parts of the page, right?
0
 

Author Comment

by:dlcnet
ID: 35094497
@Gene_Cyp:

right. I would like to block the user when an ajax request needs to update a bigger part of the page. He will not be able to use the Y scroll-bar as long as the update takes place.  
0
 
LVL 7

Expert Comment

by:Gene_Cyp
ID: 35094597
OK, well, above is the code to hide the Scrollbar. Good luck. :)

(Just keep in mind whenever you design something that users have expectations)
0

Featured Post

Best Practices: Disaster Recovery Testing

Besides backup, any IT division should have a disaster recovery plan. You will find a few tips below relating to the development of such a plan and to what issues one should pay special attention in the course of backup planning.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When applying CSS to your HTML, there are many different ways to select which element(s) the CSS applies to.  Some of these selectors are more commonly known and used than others - Here are the more common ones: #X - Matches an ID of X .X - Matche…
Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…

809 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question