Solved

How to cover browser scroll bar with an overlay

Posted on 2011-03-10
7
587 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

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

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…

739 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