AngularJS Directive Sticky Things When The User Scrolls

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

ngx sticky, sticky div in angular, angular sticky toolbar, angular 8 sticky on scroll, sticky not working angular, angularjs sticky, scroll then fix content angular, angular sticky button

Requirements

  • Angular (requires Angular 4.x or higher)
  • Supports all major browsers, IE11 and later (lower versions may not be supported)

Features:

  • Stick all the things!
  • Super smooth!
  • 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:

npm install @w11k/angular-sticky-things
or
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>

Sticky Anything Directive For Angular, angular npm sticky things


See Demo And Download

Official Website(w11k): Click Here

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

Related Posts

Searchable-Select-Dropdown

A Simple Searchable Select Dropdown Plugin | jQuery Select Search

Simple jQuery search on the selection options plugin for your website. Next, there is a checkbox replacement plugin that refines and beautifies the original selection element with…

country-dropdown-with-flags

A Quick jQuery-Based Country Picker With Flags | Country Select JS

Country Select JS is a jQuery plugin to select a country, based on the international phone input plugin. Adds a flag dropdown to any input, which lists…

Autocomplete-and-Typeahead-Javascript-Library

Simple and Fast Autocomplete and Typeahead Javascript Library | autoComplete.js

autoComplete.js is a simple, pure, and incrementally designed JavaScript library for speed, high versatility, and seamless integration with a wide variety of projects and systems. Features Pure…

Bootstrap-Notification-Message-Alert-Plugin

Bootstrap Notification Message Alert Plugin with jQuery

BootstrapMsg is a jQuery plugin for displaying messages with Bootstrap alert classes to generate hierarchical in-page navigation for an extended webpage sectioned by heading components. Using Bootstrap…

jquery-google-chart-plugin

jQuery Plugin for Transforming HTML Tables Into Charts Using Google Charts

Chartinator is a jQuery plugin for converting HTML tables, Google Sheets and js arrays into charts using Google Charts. Use data from HTML tables Chartinator is designed…

free-vue-chart-library

Customizable & Composable Charts for VueJS | vue-wcharts

WCharts is a library that makes it easy to create your own charts using Vuejs. You can easily create reusable chart components. Use a basic layout or…