jquery - CSS 显示 :none and tinyscrollbar conflict

Question

我正在调整一个包含独立部分的单页网站。例如，当我按下“服务”按钮时，它会转到页面的那部分而不显示其他内容。

服务部分需要一个滚动条。我正在为此使用tinyscrollbar。

#services { width:1100px; height:440px; bottom:0; position:absolute; top:60px; display:none; }

当包含 display:none 时，滚动条不起作用。它正在显示，但该栏无法滚动。当我删除 display:none 时，滚动条可以工作，但它完全占据了我的布局。服务内容(第 3 个菜单项)现在在第一次访问时与第 1 个菜单项的内容混合显示。这只是第一次访问。使用菜单后问题消失了，布局又正常了。

我不知道如何解决这个问题。

请帮忙。

谢谢!

附注我现在无法将网站上线。我添加了一些屏幕截图，希望能让事情变得清楚。 deleted display:none added display:none第一个屏幕截图显示可滚动的滚动条，而第二个屏幕截图则没有。该问题仅在进入网站时出现。当按下按钮时，问题就消失了

p.p.s.请在这里查看问题。我已经上传了网址:test.iwebs.ws

Answer 1

您可以定义 visibility:hidden 而不是 display:none。

visibility: hidden 隐藏元素，但它仍然占用布局空间。

display: none 从文档中完全删除该元素。它不占用任何空间，即使它的 HTML 仍在源代码中。