有没有办法从我的网站的每个浏览器中删除滚动条？答案

【问题标题】：Is there any way to remove scrollbar from every browser for my website?有没有办法从我的网站的每个浏览器中删除滚动条？
【发布时间】：2020-03-19 03:29:42
【问题描述】：

所以我正在使用 React.js 构建我的作品集，但我一直在移除滚动条。我已经分别为父 div 尝试了 overflow: hidden 和为子 div 尝试了 overflow: scroll 但它不起作用，我已经尝试了 Fullpage.js 这对我不起作用。

我想从整个网站中完全删除滚动条。请你帮助我好吗？这是我的 App.js

~ 这是一个参考站点：http://kuon.space/

import React, { useState } from "react";
import "./App.scss";
import Home from "../home/Home";
import About from "../about/About";
import Skill from "../skill/Skill";
import Project from "../project/Project";
import Contact from "../contact/Contact";
import ThemeContext from "../../common/ThemeContext";

function App() {
    const [theme, setState] = useState('darks')
    const themeStyle = {
        dark:{
            background: '#121212',
            primary: '#DADADA',
            secondary: "#A13251"
        },
        light:{
            background: '#E1E1E1',
            primary: '#333333',
            secondary: '#008F96'
        }
    }
    return (
        <ThemeContext.Provider value={
            theme==='light'?
            themeStyle.light:
            themeStyle.dark
            }>
            <Home />
            <About />
            <Skill />
            <Project />
            <Contact />
        </ThemeContext.Provider>
    );
}

export default App;

【问题讨论】：

我在 Safari 中看不到滚动条。但顺便说一句，在用户滚动时污染用户的历史记录是令人讨厌的......如果有人滚动超过一两帧，使用后退按钮离开您的网站是不可能的。
那不是我的网站。我只是把链接作为参考。 @M-N
你为什么不检查你的参考网站是如何实现它的？您可以随时调试并亲自查看吗？
@Prajwal ~ 我试过了，他使用的 FullPage.js 不适用于我的场景。
@BloodyLogic ~ 整个代码？

标签： javascript css reactjs sass

【解决方案1】：

您可以使用 css 隐藏滚动条。但不适用于移动浏览器。

.hide-scrollbar {
  scrollbar-width: none; /* Firefox 64 */
  -ms-overflow-style: none; /* Internet Explorer 11 */
}
.hide-scrollbar::-webkit-scrollbar { /** WebKit */
  display: none;
}

另一种解决方案是

.element::-webkit-scrollbar { 
    width: 0 !important 
}

【讨论】：