Overview

https://kingsora.github.io/OverlayScrollbars/
https://github.com/KingSora/OverlayScrollbars

要素内 scroll において windows でも mac みたいな scrollbar 出すやつ
perfect-scrollbar や simplebar-react からの乗り換え
react 向け readme は https://github.com/KingSora/OverlayScrollbars/tree/master/packages/overlayscrollbars-react

Usage

npm i overlayscrollbars

import 'overlayscrollbars/overlayscrollbars.css'
import { OverlayScrollbarsComponent } from 'overlayscrollbars-react'

return <OverlayScrollbarsComponent
  defer
  options={{ scrollbars: { autoHide: 'scroll' } }}
  style={{
    // 余白調整はここで
    paddingLeft: 60,
    paddingRight: 60,
    paddingTop: 20,
    paddingBottom: 20,
    width: '100vw',
    height: 'calc(100vh - 65px)', // fixed なヘッダとかあれば calc してやる
  }}
>
  {/* fit-content はさむと余白調整がうまくいく */}
  <div style={{ width: 'fit-content', height: 'fit-content'}}>
    <div style={{ width: 2560, height: 1440, background: 'red' }}>
      huge content
    </div>
  </div>
</OverlayScrollbarsComponent>

yano3nora/overlay-scrollbars-react.md

Overview

Usage