如何防止仅在主页上滚动？

Question

我正在使用react / redux在Rails中制作一个应用程序，我想防止用户在主页上滚动。但是，就目前而言，我的应用程序是单页应用程序；表示我只有一个html和body标签。我尝试将overflow: hidden添加到我的body标记中，但这会阻止在整个站点上滚动。我确实有一个单独的div，它保存了我的所有主页组件，就像这样（在组件中呈现）：

const Splash = () => (
  <div className="splash-root-container">
    <header>
      <HeaderNavContainer />
    </header>

    <div className="splash-background-container"></div>

    <div className="splash-text-container">
      <h1>Music for everyone.</h1>
      <p>Millions of songs. No credit card needed.</p>
      <Link to="/signup">{'Get Spotify Free'.toUpperCase()}</Link>
    </div>
  </div>
);

有没有一种方法可以专门停止在包含所有主页元素的div上滚动？ （.splash-root-container）

我尝试在此div中添加overflow: hidden CSS属性，但仍可以在主页（初始页面）上滚动。

Answer 1

使主容器的高度等于100vh

像这样：.main_container {高度：100vh;}