Angular Smart Slider
This project was generated with Angular CLI version 9.1.0.
Give a Star!If you like or are using this project please give it a star here. Thanks!
^9.0.0 
npm install ngx-smart-slider --save
Import the component modules you want to use into your app.module.ts file and feature modules.
import {NgxSmartSliderModule} from 'ngx-smart-slider';@NgModule({imports: [ NgxSmartSliderModule ]})export class AppModule {}
In your template write this code.
<smart-slider [cellLimit]="3" [transitionDuration]="1" [height]="200" [items]="items" [showPrevious]="isShowPrevious" [showNext]="isShowNext"></smart-slider>
| Property | Description | Type | Default |
|---|---|---|---|
| [class] | Set class | string | ‘’ |
| [transitionDuration] | Transition duration | number | 0.3 |
| [autoplayInterval] | Auto play interval (MS) | number | 2000 |
| [height] | Height | number | null |
| [cellLimit] | Cell limit to show | number | 1 |
| [itemPadding] | Item padding | number | 10 |
| [itemMargin] | Item margin | number | 10 |
| [pauseOnHover] | Pause when hover | boolean | false |
| [loop] | Is looping | boolean | false |
| [autoplay] | Auto play | boolean | false |
| [showDots] | Show dots | boolean | false |
| [showNext] | Show next button | boolean | false |
| [showPrevious] | Show previous button | boolean | false |
| [textColor] | Text color | string | ‘black’ |
| [textPosition] | Text position | 'centered-top' or 'centered-bottom' or 'centered' or 'bottom-right ' or 'top-right' or 'top-left' or 'bottom-left' |
‘centered’ |
| [items] | Items | Array |
[] |
(select) |
Event fire when select item and return item | Item | null |
$ git clone git@github.com:ShadyNagy/ngx-smart-slider.git$ cd ngx-smart-slider$ npm install$ npm run build ngx-smart-slider -- --prod$ npm run start
We welcome all contributions. Please read our CONTRIBUTING.md first. You can submit any ideas as pull requests or as GitHub issues.
We list some users here, if your company or product uses ngx-smart-slider, let us know here!