How do you hide that floating scroll indicator thing on mobile?

问题

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

::-webkit-scrollbar {
    display: none
}

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:

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.

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.

Edit:

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.

回答1:

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

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

来源：https://stackoverflow.com/questions/62098331/how-do-you-hide-that-floating-scroll-indicator-thing-on-mobile