无法滚动< body>而在MS IE11中启用全屏 [英] Can not scroll <body> while fullscreen is enabled in MS IE11
问题描述
我有一个页面与固定的页眉和页脚使用Bootstrap3。下面的内容是可滚动的。用户可以通过F11或按钮（使用FullScreen-API）启用全屏模式。这在Chrome和FF工作正常，但在IE11有问题。全屏与F11工作总是很好。但使用javascript切换全屏模式导致我的页面放置在顶部，缩小的宽度和高度，当使用IE11。我的页首和页脚保持不变。
< body&
< header>固定< / header>
< main>可滚动< / main>
< footer>固定< / footer>
< / body>
我创建了一个小小提琴，可能显示我在做什么。不幸的是，全屏不会在JSFiddle中切换，所以更好地复制代码到其他地方：
第二个显示在IE11中通过JS API启用全屏：
我可以通过将css中的html宽度设置为100％来处理这个问题。无论如何，具有溢出的页面不能再滚动了。滚动条不可见。如上所述，这在其他浏览器中工作正常。
有没有解决方法？我在这里缺少什么？感谢
你可以尝试设置html宽度为100％，你说，然后强制身体有一个滚动条使用
body {
overflow-y：scroll;
}
I have a page with fixed header and footer using Bootstrap3. The content beneath is scrollable. The user may enable the fullscreen mode via F11 or a button (using the FullScreen-API). This works fine in Chrome and FF but has problems in IE11. Fullscreen with F11 works always fine. But toggling fullscreen mode with javascript causes my page to be placed at the top bottom with shrinked width and height when using IE11. My header and footer remain intact.
<body>
<header>Fixed</header>
<main>Scrollable</main>
<footer>Fixed</footer>
</body>
I have created a small fiddle, that may show what I'm doing. Unfortunately the fullscreen wont be toggled in JSFiddle, so better copy the code to somewhere else: https://jsfiddle.net/j122kdju/
Here are two screenshots from the site. I gave the html a green backgound color to see what's happening when enabling fullscreen via JS API. First image shows the page without fullscreen in IE11:
The second shows fullscreen enabled via JS API in IE11:
I may handle this issue by setting html width in css to 100%. Anyway, pages with overflow can't be scrolled anymore. The scrollbar is not visible. As said, this works fine in other browsers.
Is there any workaround available? Am I missing something here? Thanks
EDIT: Maybe related: IE cannot scroll while in fullscreen mode
You can try to set html width to 100% as you said and then force the body to have a scrollbar using
body {
overflow-y: scroll;
}
这篇关于无法滚动< body>而在MS IE11中启用全屏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
