-
-
Notifications
You must be signed in to change notification settings - Fork 98
Scroll timeline polyfill
This plugin leverages the new Scroll Timeline feature in CSS to enhance scrollbar performance, surpassing traditional JavaScript implementations. Currently, the Scroll Timeline feature is available in Chrome but not yet in Firefox and Safari (See compatibility here). Therefore, a polyfill is necessary for cross-browser compatibility.
By default, the polyfill script is sourced directly from the flackr/scroll-timeline repo on Github. Unfortunately, the polyfill is not available on NPM.
You can use the provideScrollbarPolyfill
function to specify a custom path for the polyfill.
As of version v14.1.1, the polyfill is included with ngx-scrollbar
. To host and load the polyfill script from your server, add the following configuration to your angular.json
file:
{
"projects": {
"project-name": {
"architect": {
"build": {
"assets": [
{
"glob": "**/*",
"input": "node_modules/ngx-scrollbar/assets/",
"output": "assets"
}
]
}
}
}
}
}
Next, set the polyfill path in your app.config
file:
import { provideScrollbarPolyfill } from 'ngx-scrollbar';
export const appConfig: ApplicationConfig = {
providers: [
provideScrollbarPolyfill('assets/scroll-timeline-polyfill.js')
]
};
Become a sponsor and get your logo on our README on GitHub and the front page of https://ngx-scrollbar.netlify.com/.
Become a backer and get your logo on our README on GitHub.
Latest version (v15)
Addons:
Older version (v13)
- Demo for v13
- Usage
- Styling
- Global Options
- Pointer Events
- Scroll Event
- Updated Event
- Smooth Scroll Functions
- Performance tweak
- Integration
- Reached events