Disable scroll in Chrome

17,631

If it does not work with overflow:hidden alone, just use the window height too:

document.getElementById('yourDivId').style.height = window.innerHeight + 'px';

Here´s how to disable scrolling in the Android Chrome Browser:

document.addEventListener('touchmove', function(evt) {
    evt.preventDefault();
});

Of course you can enable it again with document.removeEventListener.

Share:
17,631
Podelo
Author by

Podelo

Updated on June 04, 2022

Comments

  • Podelo
    Podelo almost 2 years

    I need to disable a scroll in my HTML page on Chrome. I write the overflow:hidden so that hide the scroll bar and disable mouse wheel in Firefox and Internet Explorer. It still be possible to scroll in firefox with the click on mouse wheel but I don't care about that.

    So the overflow:hidden just hidden the scrollbar in Chrome but we can still scroll with the mouse wheel.

    I make a JSFiddle here but it throws some bugs with his own scroll bar so I recommend to you to create this simple html script to try:

    <html>
    <head>
    <style>
    body{
    overflow:hidden;
    }
    
    div{
    height:2000px;
    width:1300px;
    position: relative;
    background-image:linear-gradient(blue, red);
    }
    </style>
    </head>
    <body>
    <div></div>
    <span>Test</span>
    </body>
    </html>
    

    So how can we disable the scroll in chrome? Just for information I plan to make an Android application that's why Chrome is important to me.

    EDIT: Chrome bug on my computer so tests aren't good but if you have an android you can navigate to my page here and you will notice the bug: you can scroll with your finger.