javascript - 禁用元素大于视口(viewport)的水平滚动

Question

我试图创建一些类似于 google play 导航的东西，带有固定数量的 og 标签(应用浏览中的 swyping)。

我创建了一个包含一些内容 div 的 div。

<div id="container">
    <div class="section"> ... </div>
    <div class="section"> ... </div>
    <div class="section"> ... </div>
</div>

为了在部分之间创建滑动，我将容器的宽度设置为 300% 然后我根据按下的按钮设置容器的 left 属性。

我的问题是:如何禁用视口(viewport)的水平滚动？

Answer 1

您有两个解决方案:

1. 换行#container在另一个里面 <div>宽度为 100%，禁用换行和溢出:隐藏，然后滚动 #container在里面，或者

2. 输入 overflow: hidden在视口(viewport)上(或尝试使用 overflow-x:hidden);