Angular directive to make things sticky when the user scrolls (for Angular 2+) without a jQuery dependency.

angular 8 sticky things on scroll, sticky change event, angular sticky things, angular sticky component on scroll, ngx sticky, sticky image on scroll, angular scrolling banner

Features:

• Stick all things!
• Super soft!
• Tested on real projects
• Angular Universal support
• Prevents page jumping when switching to static mode
• No jQuery or other dependencies – pure angular solution

Highly Customizable Sticky Element Plugin With JavaScript | HC-Sticky

How to make use of it:

Installation

with npm:
npm install @w11k/angular-sticky-things

with yarn:
yarn add @w11k/angular-sticky-things

1. Now import the AngularStickyThingsModule in the corresponding Module.

import {AngularStickyThingsModule} from '@w11k/angular-sticky-things';

@NgModule({
  declarations: [
  ],
  imports: [
    AngularStickyThingsModule,
  ],
  providers: [],
})
export class SomeModule { }

2. Usage:

<div #spacer></div>
<div stickyThing [spacer]="spacer">
  I am sticky!
</div>

Angular Sticky Things Directive Plugin/Github

See Demo And Download

Official Website(w11k): Click Here

This superior jQuery/javascript plugin is developed by w11k. For extra Advanced Usages, please go to the official website.