✨ Carousel component for Angular
- 👌 Supports touch events
- ⚡️ Image lazy loading
- 😈 No third party library
- 😎 Easy to use API
<ui-carousel [infinite]="true" [speed]="200" >
<ui-carousel-item *ngFor="let item of items">
<img [ui-lazy-load]="item.img">
</ui-carousel-item>
</ui-carousel>
Inputs | Type | Description |
---|---|---|
infinite |
boolean |
Infinite carousel (Defaults to true) |
arrows |
boolean |
Show/hide Arrows (Defaults to true) |
dots |
boolean |
Show/hide Dots (Defaults to true) |
speed |
number |
Speed (in milliseconds) (Defaults to 400) |
autoPlay |
boolean |
Enable autoplay (Defaults to true) |
autoPlaySpeed |
number |
Autoplay interval (in milliseconds) (Defaults to 5000) |
thresholdFraction |
number |
Swipe distance to trigger slide change |
[ui-lazy-load]
: used to lazy load images in the carousel :
<ui-carousel-item>
<img [ui-lazy-load]="src">
</ui-carousel-item>
MIT