README
AngularAnimatedCarousel
AngularAnimatedCarousel is a lightweight, touchable and responsive library to create a carousel animated for angular 7
Demo
demos available here
Install
You can install the package from our npm package
npm install --save angular-animated-carousel
Dependencies
npm install --save hammerjs animate.css angular-resize-event
Usage
First you need to provide the AngularAnimatedCarouselModule to your desired Module
import {AngularAnimatedCarouselModule} from 'angular-animated-carousel';
// In your App's module or Custom Module:
@NgModule({
imports: [
AngularAnimatedCarouselModule
]
})
Now, you can use AngularAnimatedCarouselModule as follow:
CAROUSEL STATIC WIDTH
<lng-carousel> <lng-slide> ... content of slide 1 </lng-slide> <lng-slide> ... content of slide 2 </lng-slide> <lng-slide> ... content of slide 3 </lng-slide> </lng-carousel>
CAROUSEL DYNAMIC WIDTH
<lng-carousel-dynamic [height]="'380px'"> <lng-slide> ... content of slide 1 </lng-slide> <lng-slide> ... content of slide 2 </lng-slide> <lng-slide> ... content of slide 3 </lng-slide> </lng-carousel-dynamic>
API Documentation
CAROUSEL STATIC WIDTH
Inputs
- showIndicators:
If true, allows to interact with carousel using keyboard 'arrow left' and 'arrow right'.
Type: boolean
Default value: true - showDualImage:
If true, two slides will be visible on the same time.
Type: boolean
Default value: true
Outputs
- counterChange: Emits an event with the current counter value.
- showIndicators:
If true, allows to interact with carousel using keyboard 'arrow left' and 'arrow right'.
CAROUSEL DYNAMIC WIDTH
Inputs
- height: Set the height of the carousel
Type: string
- height: Set the height of the carousel
Author
Laura Cristina Navarro Galvan
License
MIT