@enten/ngx-sticky

⚠️ 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

Thanks to

• @w11k/angular-sticky-things

License

MIT