在 IE 中隐藏滚动条答案

【问题标题】：Hide scrollbar in IE在 IE 中隐藏滚动条
【发布时间】：2011-08-30 11:25:33
【问题描述】：

在我们的 UI 应用程序中，我们为此使用 JSF 或 Prime 面孔。我们想为我们的应用程序隐藏滚动条，但我们正在努力在 Internet Explorer 中实现这一点（我们使用的是 IE7）。

有什么方法可以防止在 Internet Explorer 中显示滚动条？我尝试将overflow: hidden; 放在 CSS 中，但它不起作用。

我几乎尝试了 DOM 中的每个节点并将width/height 设置为100%，margin: 0px、padding: 0px。在 Firefox 中似乎很好用，但在 IE7 中却不行？

【问题讨论】：

看什么以及在哪里看？
如果您询问 BODY 元素上的滚动条，请参阅 Fraser 对 IE 的响应。如果不是 - 让问题更准确。
IE6? http://www.ie6countdown.com/
@dov.amir....请提供任何解决方案，因为我对此并不了解。

标签： html css internet-explorer-7

【解决方案1】：

如果有人仍然需要解决方案，这个对我有用：

.container{
    -ms-overflow-style: none;
    overflow: auto;
}

此更改允许在容器上滚动并隐藏 IE 上的栏。

另一方面，如果您想隐藏它并在用户再次滚动后再次显示它，您可以使用。

.container {
    -ms-overflow-style: -ms-autohiding-scrollbar;
}

如果您想完全隐藏它（滚动条），而不仅仅是您可以使用的特定容器：

    body::-webkit-scrollbar { display: none;  }

在 IE 10 && 11 上测试。

Reference

【讨论】：

既然 edge 决定采用铬，你可能不再需要这个了。 github.com/MicrosoftEdge/MSEdge/blob/master/README.md

【解决方案2】：

不看代码很难说！话虽如此，您可以尝试使用微软为 Internet Explorer 引入的“扩展属性”。

<body scroll="no">

编辑：

您也可以尝试像这样在 CSS 中设置 html 页面的溢出属性。

html, body { overflow: hidden; }

【讨论】：

@FFraser ....我测试了它，但它不起作用，仍然显示滚动条。你还有其他解决方案吗？
@BalusC...请看这个问题。
另外请记住，overflow:hidden 对您不起作用，除非您有定义的高度。
@Dalal +1 - 好点 - OP 没有发布任何代码，所以我只是放弃了可能性......
据我所知，第二个没有帮助，滚动条仍然显示但禁用。

【解决方案3】：

这个 CSS 在 Chrome 和 IE 10 中都适用于我：

/* Oculta la scroll-bar pero sigue permitiendo hacer scroll con el mouse */
    body::-webkit-scrollbar { display: none;  }
    html, body { -ms-overflow-style: none; overflow: auto; }

【讨论】：

这是问题的真正答案，但仍然只解决 ie10+

【解决方案4】：

您可以使用此代码将其实现到正文中--

body { overflow-x:hidden; }

如果不是这样，请查看布局，看看是否有任何容器的宽度不合适，这使得布局有点拉伸......

【讨论】：

【解决方案5】：

在你尝试overflow:hidden;之前，请确保 IE 未处于兼容模式

【讨论】：

【解决方案6】：

使用

.classname {
    -ms-overflow-style: -ms-autohiding-scrollbar;
}

这会自动隐藏 scollbar，但在滚动时会再次显示

https://developer.mozilla.org/en-US/docs/Web/CSS/-ms-overflow-style

【讨论】：

【解决方案7】：

我无法提供纯 CSS 解决方案，但如果您使用 jQuery，则可以轻松地将计算出的宽度和高度设置为 body：

$("body").css({"width": body.width()+"px", "height": body.height()+"px"})

然后

$("body").css({"overflow": "hidden"});

也在 IE 中工作（至少在 IE9+ 中）。我的目标是使页面暂时不可滚动（当显示具有自己滚动功能的自定义对话框时）。当自定义对话框关闭时，我将 body 样式属性重置为之前的状态（以删除计算出的 body 宽度和高度）。

【讨论】：