Wondering what’s next for npm?Check out our public roadmap! »

@greg-md/ng-elevatorTypeScript icon, indicating that this package has built-in type declarations

1.0.11 • Public • Published

Ng Elevator

npm version Build Status

Make a container to elevate on the screen while scrolling with Angular.

Table of Contents:

Installation

npm install @greg-md/greg-elevator --save

How It Works

Setting up in a module

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
 
// 1. Import elevator module;
import { ElevatorModule } from '@greg-md/greg-elevator';
 
import { AppComponent } from './app.component';
 
@NgModule({
  imports: [
    BrowserModule,
    // 2. Register elevator module.
    ElevatorModule,
  ],
  declarations: [
    AppComponent,
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

Using in templates

import { Component } from '@angular/core';
 
@Component({
  selector: 'app-root',
  styles: `
    .sidebar {
        width: 200px;
        height: 500px;
    }
  `,
  template: `
    <section class="sidebar">
      <greg-elevator>
        You will see me while scrolling.
      </greg-elevator>
    </section>
  `,
})
export class AppComponent { }

Component Attributes

marginTop

Elevator by default is fixed on the top of the screen while scrolling up. You could set a margin top for the elevator.

Example:

<greg-elevator [marginTop]="20">
  Hello! I am elevating.
</greg-elevator>

marginBottom

If the elevator height is bigger than the screen height, elevator by default is fixed on the bottom of the screen while scrolling down. You could set a margin bottom for the elevator.

Example:

<greg-elevator [marginBottom]="20">
  Hello! I am elevating.
</greg-elevator>

License

MIT © Grigorii Duca

Huuuge Quote

I fear not the man who has practiced 10,000 programming languages once, but I fear the man who has practiced one programming language 10,000 times. #horrorsquad

Install

npm i @greg-md/ng-elevator

DownloadsWeekly Downloads

4

Version

1.0.11

License

MIT

Unpacked Size

185 kB

Total Files

27

Last publish

Collaborators

  • avatar