window.pageYOffset is always 0 with overflow-x: hidden

Question

I\'m creating a webpage that has some off-screen content that only needs to slide in at specific times. To achieve this I\'m setting overflow-x: hidden on htm

Answer 1

I had the exact same problem and i resolved it after a long search.

The problem seems to comes from overflow-x: hidden inside the body. So to fix this strange behavior i used a wrapper like this :

   

      All your content here
   

and then I moved the overflow attribute in the wrapper's CSS instead of letting it in html, body :

html, body {
    margin:0;
    padding:0;
    height: 100%;
}
.wrapper {
    height: 100%;
    overflow-x: hidden;
} 

With this little trick when i scan my srollTop propertie now located in my wrapper element, the result is no longer 0 but the real value. Without that it doesn't work on Chrome ...