1

I have a div with position fixed (my dialog) which i give a higher z-index to takeover my page when a certain action is performed. Am trying to hide my scrollbar by doing overflow:hidden;without affecting the width of the page when the div takes over the page. Any suggestion how this would be performed??

html, body {
background: #FFFFFF;
font-family: "Avenir Medium";
height: 100%;
transition: overflow 0.37s easein-out
}

.div-dialog{
display: none;
opacity: 0;
position: fixed;
width: 0;
left: 0;
top: 0;
z-index: 0;
overflow: hidden;
background: white;
-webkit-transition: opacity 0.30s ease-in-out;
transition: opacity 0.30s easein-out;
}

Jfiddle trying to replicate my result.The implementation am trying to realize is that of myspace when you click the search icon at the top left

Phil
  • 597
  • 11
  • 26
  • It might be helpful if you explained why you are trying to acomplish this as well as providing an example on [JFiddle](https://jsfiddle.net/) or [Codepen](http://www.codepen.io). – claytoncasey01 Jan 29 '16 at 15:33
  • Could you show a live example? Which scrollbar do you want to hide? The bar from your normal content or a bar which is cause by the overlay-div? – Michael Walter Jan 29 '16 at 15:33
  • Check this [scrolling-element-without-scrollbar-with-css](http://stackoverflow.com/questions/19466750) SO question/answers. Mayby that will work for you... – Rene van der Lende Jan 29 '16 at 15:48
  • here's a [jfiddle](https://jsfiddle.net/o2ztuppp/), im my situation the browser width increases as i hide and shrinks as i display the scrollbar. there's also a fadein animation which makes it all the more visible – Phil Jan 29 '16 at 16:14

1 Answers1

3

Was finally able to fix my problem, by doing the following

    html,body{
     height: 100%;
     overflow: hidden;
    }
    body{
     overflow: auto;
    }

By doing this all my content stays within the body, so when an element has a position of fixed, it covers the scrollbar and its not affected by any change to its overflow,overflow:hidden or overflow:auto

Phil
  • 597
  • 11
  • 26