您如何在移动设备上隐藏该浮动滚动指示器? [英] How do you hide that floating scroll indicator thing on mobile?

问题描述

起初我以为您可以使用适用于台式机Chrome的此规则:

At first I thought you could use this rule which works for desktop Chrome:

::-webkit-scrollbar {
    display: none
}

但是没有用.弄乱webkit-scrollbar及其其他选择器后，我意识到这件事可能根本不属于webkit-scrollbar的一部分:

But it didn’t work. After messing with webkit-scrollbar and its other selectors, I realized that this thing might not be part of the webkit-scrollbar after all:

这就是为什么它不受我为webkit-scrollbar制定的任何规则的原因.

That’s why it’s not affected to whatever rules I make for webkit-scrollbar.

该浮动滚动指示器仅在您滚动页面时出现.

That floating scroll indicator thing only appears when you scroll a page.

就上下文而言，我正试图将其隐藏在我用来阅读网络漫画的网站中，因为这会分散人们的注意力.我在Kiwi浏览器(基于Chrome的Android浏览器，支持扩展)上使用Stylus扩展程序来自定义网站的CSS.

For context, I’m trying to hide that thing for a website I’m using for reading webtoons because it’s distracting. I’m using the Stylus extension on Kiwi browser (an Android browser based on Chrome that supports extensions) to customize the CSS of a website.

这些是Google搜索结果"Reddit"的屏幕截图. ::-webkit-scrollbar {display: none;}生效.滚动时我拿走了它们.工作滚动条在桌面上可见，但在移动设备上不可见.移动电话只有那个指示器元素.

These are screenshots of Google search results for "Reddit". ::-webkit-scrollbar {display: none;} is on effect. I took them while scrolling. The working scrollbar is visible on desktop but not on mobile. The mobile only has that indicator element thing.

• 常规-滚动条已隐藏.
• 设备模式-滚动显示该指示符.

• Regular - the scrollbar is hidden.
• Device Mode - that indicator thing shows up when you scroll.

推荐答案

由于Kiwi基于WebKit，因此应该可行.您可以尝试使用width:

Because Kiwi is based on WebKit, it should be possible. You could try with width:

body::-webkit-scrollbar {
   width: 0 !important 
}

这篇关于您如何在移动设备上隐藏该浮动滚动指示器?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！