@enten/ngx-sticky
:warning: WIP
An Angular directive for making things sticky when the user scrolls (for Angular 2+) with no jQuery Dependency.
Requirements
- Angular (requires Angular 4.x or higher)
- Supports all major browsers and IE11 and up (lower versions might not be supported)
Features
- Stick all the things!
- Super smooth!
- Tested in real world projects
- Support for Angular Universal
- Prevents page-jumping when switching to sticky mode
- No jQuery or other dependencies - pure Angular solution
- Support for boundaries to make elements stop
Installation
with npm:
npm install @enten/ngx-sticky
with yarn:
yarn add @enten/ngx-sticky
Now import the NgxStickyModule in the corresponding Module
import { NgxStickyModule } from '@enten/ngx-sticky';
@NgModule({
declarations: [
],
imports: [
NgxStickyModule,
],
providers: [],
})
export class SomeModule { }
Usage
<div ngxSticky>
I am sticky!
</div>
Showcases
| @enten/ngx-sticky | @angular/core | rxjs |
|---|---|---|
17.0.0 | ^17.0.0 | ^6.5.3 || ^7.4.0 |
16.0.0 | ^16.0.0 | ^6.5.3 || ^7.4.0 |
15.0.0 | ^15.0.0 | ^6.5.3 || ^7.4.0 |
14.0.0 | ^14.0.0 | ^6.5.3 || ^7.4.0 |
13.0.0 | ^13.0.0 | ^6.5.3 || ^7.4.0 |
12.0.0 | ^12.0.0 | ^6.5.3 || ^7.0.0 |
11.0.0 | ^11.0.0 | ^6.5.3 |
10.0.0 | ^10.0.0 | ^6.5.3 |
9.0.0 | ^9.0.0 | ^6.5.3 |
8.0.0 | ^8.0.0 | ^6.4.0 |
7.0.0 | ^7.0.0 | >=6.0.0 <6.4.0 |
6.0.0 | ^6.0.0 | >=6.0.0 <6.4.0 |