🎨 Angular carousel Component 🔥
Switch branches/tags
Nothing to show
Clone or download
bougarfaoui Merge pull request #3 from msamprz/master
Fixes ObjectUnsubscribedError on prevSubject and nextSubject unsubscr…
Latest commit 3f16130 Feb 16, 2018
Permalink
Failed to load latest commit information.
arrow first commit Dec 26, 2017
directives first commit Dec 26, 2017
dots first commit Dec 26, 2017
examples examples Dec 26, 2017
ui-carousel-item first commit Dec 26, 2017
ui-carousel Fixes ObjectUnsubscribedError on prevSubject and nextSubject unsubscr… Feb 15, 2018
.gitignore first commit Dec 26, 2017
.npmignore first commit Dec 26, 2017
LICENSE Create LICENSE Dec 29, 2017
README.md Update README.md Dec 27, 2017
index.ts first commit Dec 26, 2017
package.json first commit Dec 26, 2017
tsconfig-aot.json first commit Dec 26, 2017
tsconfig.json first commit Dec 26, 2017
tslint.json first commit Dec 26, 2017

README.md

🌀ui-carousel

Carousel component for angular 4 and 5

💥 Features :

  • 👌 Supports touch events
  • ⚡️ Image lazy loading
  • 😈 No third party library
  • 😎 Easy to use API

Install

npm install ui-carousel --save

Demo :

Demo

Example :

    <ui-carousel [infinite]="true" [fade]="false" [speed]="200" >
        <ui-carousel-item *ngFor="let item of items">
            <img [ui-lazy-load]="item.img">
        </ui-carousel-item>
    </ui-carousel>

API

Inputs

Inputs Type Description
infinite boolean Infinite carousel
arrows boolean Show/hide Arrows
dots boolean Show/hide Dots
speed number Speed (in milliseconds)
fade bool Enable fade mode
height string Height of the carousel (in px or %)
width string Width of the carousel (in px or %)

Directives :

[ui-lazy-load] : used to lazy load images in the carousel :

  <ui-carousel-item>
     <img [ui-lazy-load]="src">
  </ui-carousel-item>

Licence :

MIT