如何在垂直滚动条尚未存在的情况下补偿垂直滚动条

也许这是一个简单的解决方法，但它已经让我疯狂了很长时间，所以我最终决定了解是否存在解决方案。如何在垂直滚动条尚未存在的情况下补偿垂直滚动条

简而言之，我将大部分网页放在宽视角端口中。

例如，一个视图端口可能是1028px，我希望我的页面宽度仅为960px。

所以我的CSS是这样的：

#pageWrapper { /* page width is 960 pixels */ 
    margin:0 auto; 
    width:960px; 
}

没有异议。

问题出现在我开始动态页面的时间比页面高度短的时候，然后我的页面在屏幕底部展开（通过jQuery slideOut等）并导致垂直滚动条出现。

它最终使页面在slideOut期间闪烁，然后在slideIn期间向右闪烁。

有没有办法通过CSS强制20px右边距，仍然利用margin:0 auto;？

谢谢。

您可以尝试在'html'或'body'元素上使用'overflow-y：scroll'，但我不确定这是否可行。同时你应该可以用3行javascript/jquery做这个，然后把这个函数附加到'onresize'事件。 – 2012-03-10 22:37:06

另一种方法是强制滚动条始终存在。有一个CSS选项，但我不记得它是什么。 – 2012-03-10 22:38:54

@ErickPetru不，那不是。 – 2012-03-10 22:43:40

当页面内容不再适合垂直时，浏览器会在窗口的右侧添加一个滚动条。这会更改浏览器窗口中的可用宽度，因此，相对于窗口右侧居中或定位的任何内容都会向左移动一点。这很常见。

有很多方法可以控制这个，但最常见的是要么通过控制窗口上的overflow-y属性来使其始终具有滚动条或从不具有滚动条。

设置overflow-y: scroll将强制滚动条始终在那里。

设置overflow-y: hidden将强制在那里永远不会滚动条。

2012-03-10 22:50:00 jacktheripper

好的，谢谢@jacktheripper。 – 2012-03-10 23:28:35

注意：overflow-y: hidden可防止用户通过任何方式向下滚动，从而无法访问低于下方视口的任何内容。

2017-01-19 02:15:51 PERoqe

回答