ngx-sticky
Angular sticky boxes
Description
Angular attribute directive for the creation of sticky boxes in the web-pages of your applications. Compatible Angular4+.
This directive will have a result similar to the CSS3 property position: sticky but it also allows to set sticky boxes in respect to the bottom baseline of the view.
Installation
To install this component to an external project, follow the procedure:
-
npm install ngx-sticky --save
-
Add NgxStickyModule import to your @NgModule like example below
; ; ; ;
Usage
Apply the appSticky directive to your HTML tags and use the following attributes to manage its options.
Attributes
Option | Default | Type | Description |
---|---|---|---|
position | 'top' | string | Position of reference for the sticky. top: the element will stick in respect to the top line. bottom: the element will stick in respect to the bottom line. |
margin | 0 | number | Number of pixel for the element margin in respect of the reference position while it is sticky. |
Compatibility (tested with)
- Firefox (latest)
- Chrome (latest)
- Edge
- IE10
- Safari
License
- License: MIT
Author
- Author: barbared
Keywords
- sticky
- Angular2+
- typescript