发表新帖
发表新帖

Disable Scrolling on Body

后端 未结
关注
4 1156
一向
一向 2020-12-12 12:44

I would like to disable scrolling on the HTML body completely. I have tried the following options:

  • overflow: hidden; (not working,

相关标签:
4条回答
  • 天涯浪人
    2020-12-12 13:21

    Set height and overflow:

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

    http://jsfiddle.net/q99hvawt/

    0 讨论(0)
  • 忘了有多久
    2020-12-12 13:22

    To accomplish this, add 2 CSS properties on the <body> element.

    body {
   height: 100%;
   overflow-y: hidden;
}

    These days there are many news websites which require users to create an account. Typically they will give full access to the page for about a second, and then they show a pop-up, and stop users from scrolling down.

    0 讨论(0)
  • 伪装坚强ぢ
    2020-12-12 13:28

    This post was helpful, but just wanted to share a slight alternative that may help others:

    Setting max-height instead of height also does the trick. In my case, I'm disabling scrolling based on a class toggle. Setting .someContainer {height: 100%; overflow: hidden;} when the container's height is smaller than that of the viewport would stretch the container, which wouldn't be what you'd want. Setting max-height accounts for this, but if the container's height is greater than the viewport's when the content changes, still disables scrolling.

    0 讨论(0)
  • 忘了有多久
    2020-12-12 13:34

    HTML css works fine if body tag does nothing you can write as well

    <body scroll="no" style="overflow: hidden">

    In this case overriding should be on the body tag, it is easier to control but sometimes gives headaches.

    0 讨论(0)
 看不清?
提交回复
热议问题