如何停止水平滚动?

kis*_*ore 3 html javascript css

我用html和javascript编写了一个文件.

在那里垂直滚动应该在那里,但我想停止水平滚动.

我怎样才能做到这一点?

T.J*_*der 8

Sarfraz 已经提到了 overflow-x,这是一个答案,虽然它意味着(正如它所说的那样!)任何本来可以向右移动的东西现在对用户来说都是不可用的.有用例,但主要是不希望有用户无法访问的内容.

问题是:你为什么要进行水平滚动?在正常情况下,浏览器将包装内容,使得不需要任何水平滚动.如果用户具有正常窗口大小,则通过将指定为特定宽度的元素(通过样式信息或具有不可包装的内容(如大图像))导致设计中的水平滚动.例如,这不需要水平滚动:

<p>...lots of text here...</p>
Run Code Online (Sandbox Code Playgroud)

......但这会:

<p style='width: 1200px'>...lots of text here...</p>
Run Code Online (Sandbox Code Playgroud)

...如果用户的浏览器窗口宽度小于1200像素.

因此,如果将内容移至右侧不可用不是您想要的,我的答案是找到导致滚动的元素并更正它们.


Sar*_*raz 6

将以下样式应用于该元素:

overflow-x:hidden;
Run Code Online (Sandbox Code Playgroud)

或它应该是:

overflow:auto;
overflow-x:hidden;
Run Code Online (Sandbox Code Playgroud)

这将确保在需要时垂直滚动.

  • 我对这种方法有些麻烦.网站上的滚动条消失了,但当我点击中间滚动时,我仍然可以移动网站以查看我想要隐藏的内容... (2认同)