Get unlimited public & private packages + package-based permissions with npm Pro.Get started »

ng-fixed-element

1.0.0 • Public • Published

Angular Fixed Element

This Angular plug-in allows you to keep items on the page at the top.


Demo

Click here for a live demo.

Installation

You can use npm to install the package.

NPM
npm install --save ng-fixed-element

Use

Follow the steps below to add the ng-fixed-element package to your project.

1. Import NgFixedElementModule Import NgFixedElementModule in the module you want to use in your application.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
 
/* Import the module */
import {NgFixedElementModule} from 'ng-fixed-element';
 
import { AppComponent } from './app.component';
 
@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    NgFixedElementModule // Import here
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
 

2. Use within HTML Give the ngFixedElement directive to the object you want to fix. Example;

<div class="sidebar" ngFixedElement [marginTop]="10">
  <ul>
    <li>Sidebar Item 1</li>
    <li>Sidebar Item 2</li>
    <li>Sidebar Item 3</li>
    <li>Sidebar Item 4</li>
    <li>Sidebar Item 5</li>
    <li>Sidebar Item 6</li>
  </ul>
</div>

If you do not want to give a space above, you can remove the [marginTop] property, which will be 0 by default.

Features

Name Type Required Default Description
marginTop Number No 0 Sets the spacing of the pinned object from above.

Author

Mehmet Sert

Install

npm i ng-fixed-element

DownloadsWeekly Downloads

0

Version

1.0.0

License

MIT

Unpacked Size

63.9 kB

Total Files

29

Last publish

Collaborators

  • avatar