Html 在 IE 中隐藏滚动条
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7242385/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Hide scrollbar in IE
提问by Vikas Soni
In our application for UI we are using JSF or Prime faces for that. We would like to hide the scrollbar for our application, but we are struggling to achieve this in Internet Explorer (We are using IE7).
在我们的 UI 应用程序中，我们为此使用了 JSF 或 Prime 面孔。我们想为我们的应用程序隐藏滚动条，但我们正在努力在 Internet Explorer 中实现这一点（我们使用的是 IE7）。
Is there any way to prevent for displaying the scroll bar in Internet explorer?
I tried to put overflow: hidden;in CSS,but it's not working.
有什么办法可以防止在 Internet Explorer 中显示滚动条？我试图放入overflow: hidden;CSS，但它不起作用。
I have tried nearly every node in the DOM and set width/heightto 100%, with margin: 0px, padding: 0px. Seems to work great in Firefox, but it doesn't work in IE7?
我几乎尝试了 DOM 中的每个节点并将width/设置height为100%, margin: 0px, padding: 0px。似乎在 Firefox 中运行良好，但在 IE7 中不起作用？
回答by Crisoforo Gaspar
In case of anyone still needs a solution, this one worked for me:
如果有人仍然需要解决方案，这个对我有用：
.container{
-ms-overflow-style: none;
overflow: auto;
}
This change allows scroll on the container and hides the bars on IE.
此更改允许在容器上滚动并隐藏 IE 上的栏。
In case you want to hide it completely (the scrollbar) not only from a specific container you can use:
如果您不仅要从特定容器中完全隐藏它（滚动条），您还可以使用：
body::-webkit-scrollbar { display: none; }
Testedon IE 10 && 11.
在 IE 10 && 11 上测试。
回答by Fraser
Hard to say without seeing the code! Saying that, You could try use using the "Extended Attributes" that Microsoft introduced for Internet Explorer.
不看代码很难说！话虽如此，您可以尝试使用 Microsoft 为 Internet Explorer 引入的“扩展属性”。
<body scroll="no">
EDIT:
编辑：
You could also try setting the overflow property of the html page in CSS like so.
您也可以尝试像这样在 CSS 中设置 html 页面的溢出属性。
html, body { overflow: hidden; }
回答by Jhollman
This CSS works for me both in Chrome and IE 10:
这个 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; }
回答by SaurabhLP
You may use this code implement it into body --
您可以使用此代码将其实现到正文中-
body { overflow-x:hidden; }
If not by that look into the layout and see if any container have a untoward width of something which is making the layout stretch a bit...
如果不是通过查看布局并查看是否有任何容器具有使布局拉伸一点的不合适的宽度...
回答by curt
Make sure IE is not in compatibility mode before you beat yourself up while trying overflow:hidden;
在尝试之前，请确保 IE 未处于兼容模式 overflow:hidden;
回答by Archie Archbold
use
用
.classname {
-ms-overflow-style: -ms-autohiding-scrollbar;
}
This automatically hides the scollbar but shows it again when scrolling
这会自动隐藏滚动条，但在滚动时再次显示
https://developer.mozilla.org/en-US/docs/Web/CSS/-ms-overflow-style
https://developer.mozilla.org/en-US/docs/Web/CSS/-ms-overflow-style
回答by Timo K?hk?nen
I cannot provide plain CSS solution, but if you use jQuery, it is easy to set the computed width and height to the body this way:
我无法提供简单的 CSS 解决方案，但是如果您使用 jQuery，很容易通过这种方式将计算出的宽度和高度设置为主体：
$("body").css({"width": body.width()+"px", "height": body.height()+"px"})
and then
进而
$("body").css({"overflow": "hidden"});
worked also in IE (at least in IE9+). My goal was to make page not scrollable temporarily (when custom dialog with own scrolling capability was shown). And when custom dialog was closed, I reset the body style attribute to its previous state (to remove the computed body width and height).
也在 IE 中工作（至少在 IE9+ 中）。我的目标是使页面暂时不可滚动（当显示具有自己滚动功能的自定义对话框时）。当自定义对话框关闭时，我将 body 样式属性重置为其以前的状态（以删除计算的 body 宽度和高度）。
