ngx-scrollbar

Custom overlay-scrollbars with native scrolling mechanism

codecovnpm
Go To Documentation
Content length
Content width
Options
Orientation
Position
Visibility
Appearance
Direction
Buttons
Disable interactions
Disable sensor
Disable reached events
Disable dropped events
Sensor throttle time
Track scroll duration
Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet mollitia vero quam, nisi possimus dolorem asperiores, molestiae sit voluptatibus alias consequuntur laudantium repellat ea quidem quaerat rerum perspiciatis iste adipisci. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet mollitia vero quam, nisi possimus dolorem asperiores.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet mollitia vero quam, nisi possimus dolorem asperiores, molestiae sit voluptatibus alias consequuntur laudantium repellat ea quidem quaerat rerum perspiciatis iste adipisci. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet mollitia vero quam, nisi possimus dolorem asperiores.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet mollitia vero quam, nisi possimus dolorem asperiores, molestiae sit voluptatibus alias consequuntur laudantium repellat ea quidem quaerat rerum perspiciatis iste adipisci. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet mollitia vero quam, nisi possimus dolorem asperiores.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet mollitia vero quam, nisi possimus dolorem asperiores, molestiae sit voluptatibus alias consequuntur laudantium repellat ea quidem quaerat rerum perspiciatis iste adipisci. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet mollitia vero quam, nisi possimus dolorem asperiores.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet mollitia vero quam, nisi possimus dolorem asperiores, molestiae sit voluptatibus alias consequuntur laudantium repellat ea quidem quaerat rerum perspiciatis iste adipisci. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet mollitia vero quam, nisi possimus dolorem asperiores.

Reached
Dropped
Scrolling Smooth scroll options
Function
Axis-Y
Axis-X
Result
scrollTo({bottom: 0, end: 0, duration: 800})

Examples

TODO
  • Clean the house
  • Take out the thrash
  • Do the dishes
  • Feed the dog
  • Go to gym
  • Clean the house
  • Take out the thrash
  • Do the dishes
  • Feed the dog
  • Go to gym
  • Clean the house
  • Take out the thrash
  • Do the dishes
  • Feed the dog
  • Go to gym
  • Clean the house
  • Have a beer

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Posted 9 hours ago by noeldelgado

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quis facere debitis ullam, quae quidem, impedit culpa nam repellat in voluptatibus esse ab harum, hic? Aliquam nesciunt voluptates repellendus assumenda labore.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro quos voluptate doloribus. Optio unde inventore, tempore nemo repellat expedita! Quod, accusamus nobis iure. Aliquam quibusdam, nemo explicabo ipsum provident asperiores.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quaerat, qui, rem! Debitis cum maiores iste, possimus! Obcaecati accusamus eaque expedita quo soluta quis, repudiandae similique, veritatis repellendus facere suscipit! Et!

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum doloremque repellat praesentium quae et consectetur iure quos porro, provident voluptates reprehenderit a. Accusamus ut, quaerat asperiores blanditiis voluptate, sint facilis.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus beatae inventore nobis esse temporibus exercitationem eos illo minima non magnam, provident sit doloribus maiores odio in animi quidem unde. Perferendis.

            
            <!DOCTYPE html>
              <html lang="en">
              
              <-- BEGIN head -->
              <head>
                 <meta charset="utf-8" />
                 <title>ngx-scrollbar – Fully skinnable scrollbars with native scrolling.</title>
              </head>
              
              <-- BEGIN body -->
              <body>
            
          

Sponsors

Sponsors on Open Collective

Backers

Backers on Open Collective

Made with ❤️ by Murhaf Sousli