发表新帖
发表新帖

How to disable scrolling the document body?

前端 未结
关注
6 492
一整个雨季
一整个雨季 2020-12-28 15:14

I have a HTML which has lot of content and a vertical scrollbar appears as soon as the HTML is loaded. Now from this HTML a full screen IFRAME is loaded. The problem is when

相关标签:
6条回答
  • 感动是毒
    2020-12-28 15:48

    The following JavaScript could work:

    var page = $doc.getElementsByTagName('body')[0];

    To disable Scroll use:

    page.classList.add('noscroll');

    To enable Scroll use:

    page.classList.remove('noscroll');

    In the CSS file, add:

    .noscroll {
    position: fixed!important
}
    0 讨论(0)
  • 隐瞒了意图╮
    2020-12-28 15:49

    with css

    body,html{
  overflow:hidden
}
    0 讨论(0)
  • 青春惊慌失措
    2020-12-28 15:49

    I know this is an ancient question, but I just thought that I'd weigh in.

    I'm using disableScroll. Simple and it works like in a dream.

    I have had some trouble disabling scroll on body, but allowing it on child elements (like a modal or a sidebar). It looks like that something can be done using disableScroll.on([element], [options]);, but I haven't gotten that to work just yet.

    The reason that this is prefered compared to overflow: hidden; on body is that the overflow-hidden can get nasty, since some things might add overflow: hidden; like this:

    ... This is good for preloaders and such, since that is rendered before the CSS is finished loading.

    But it gives problems, when an open navigation should add a class to the body-tag (like <body class="body__nav-open">). And then it turns into one big tug-of-war with overflow: hidden; !important and all kinds of crap.

    0 讨论(0)
  • 渐次进展
    2020-12-28 15:50

    add this css

    body.disable-scroll {
    overflow: hidden;
}

    and when to disable run this code

    $("body").addClass("disable-scroll");

    and when to enabled run this code

    $("body").removeClass("disable-scroll")
    0 讨论(0)
  • 后悔当初
    2020-12-28 15:55

    Answer : document.body.scroll = 'no';

    0 讨论(0)
  • 暗喜
    2020-12-28 15:56

    If you want to use the iframe's scrollbar and not the parent's use this:

    document.body.style.overflow = 'hidden';

    If you want to use the parent's scrollbar and not the iframe's then you need to use:

    document.getElementById('your_iframes_id').scrolling = 'no';

    or set the scrolling="no" attribute in your iframe's tag: <iframe src="some_url" scrolling="no">.

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