Angular Custom Scrollbar

Content length

Content width

Options

Orientation

Position

Visibility

Appearance

Direction

Hover offset

Buttons

Disable interactions

Disable sensor

Disable reached events

Disable dropped events

Sensor throttle time

Track scroll duration

Styling

CSS variables options

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.

Reached

Top

Bottom

Start

End

Dropped

Top

Bottom

Start

End

Scrolling

Smooth scroll options

Function

Axis-Y

Axis-X

Duration

bottom

end

Result

scrollTo({bottom: 0, end: 0, duration: 800})

Examples

TODO

Morning Exercise
Healthy Breakfast
Email Check
Plan the Day
Work on Project
Lunch Break
Learn Something
Organize Workspace
Evening Relaxation
Go to gym
Household Chores
Take Out The Trash
Grocery Shopping
Check Finances
Creative Time
Review Goals
Outdoor Activity

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>

ngx-scrollbar

Custom overlay-scrollbars with native scrolling mechanism

Examples

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Sponsors

Backers