NGX-SMART-SLIDER

This project was generated with Angular CLI version 9.1.0.

:star: Give a Star!

If you like or are using this project please give it a star here. Thanks!

Screenshot

✨ Features

• Slider.

☀️ License

🖥 Environment Support

• Angular ^9.0.0

📦 Installation

NPM

npm install ngx-smart-slider --save

🔨 Usage

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>

Properties

| 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 |

🔗 Links

• NPM
• Website
• LinkedIn
• Twitter

⌨️ Development

$ git clone [email protected]:ShadyNagy/ngx-smart-slider.git
$ cd ngx-smart-slider
$ npm install
$ npm run start

🤝 Contributing

We welcome all contributions. Please read our CONTRIBUTING.md first. You can submit any ideas as pull requests or as GitHub issues.

🎉 Users

• ShadyNagy

We list some users here, if your company or product uses ngx-smart-slider, let us know here!