Needlessly Promiscuous, Modularize!
    Have ideas to improve npm?Join in the discussion! »

    angular-minimalist-parallax
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.9 • Public • Published

    angular-minimalist-parallax

    If you need more subtlety or just want to get out of the old background-attachment: fixed, get to know the angular-minimalist-parallax

    Installation

    1. Use npm to install the component
    npm i angular-minimalist-parallax --save
    1. Add the angular-minimalist-parallax component to your app.

    Include the following on your src/app/app.module.ts.

    import { MinimalistParallaxModule } from 'angular-minimalist-parallax';
     
    @NgModule({
      declarations: [
        MyApp,
        ...
      ],
      imports: [
        IonicModule.forRoot(MyApp),
        MinimalistParallaxModule
      ],
      ...
    })

    Usage

    add the parallax attribute to the <ion-content> in your template:

    <ion-content parallax>
     <div class="over">
      <div class="bg"  [ngStyle]="{'background-image': 'linear-gradient(to bottom, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.2) 100%), url('+image+')'}">
        <!-- <div class="child">
          <h2>{{ text optional }}</h2>  
        </div> -->
      </div>
     </div>
    </ion-content>
     
     

    Demo

    Animated

    Donate

    Help us develop and improve our plugins -->

    Install

    npm i angular-minimalist-parallax

    DownloadsWeekly Downloads

    0

    Version

    1.0.9

    License

    ISC

    Unpacked Size

    4.65 MB

    Total Files

    19

    Last publish

    Collaborators

    • avatar