InfiniteCarousel

InfiniteCarousel is a Angular library containing an infinite carousel to present images for your app.

This library was generated with Angular CLI version 16.2.0.

Installation

Use the package manager npm to install InfiniteCarousel.

npm i ngx-infinite-smooth-carousel --save

Usage

Main module file

import { InfiniteCarouselModule, ICConfig } from 'ngx-infinite-smooth-carousel';

@NgModule({
  imports: [
    InfiniteCarouselModule,
  ],
})
export class AppModule { }

Component HTML

<infinite-carousel [config]="customConfig"></infinite-carousel>

Component TS

customConfig: ICConfig = {
  itemWidth: "150",          /* Width of each img in px */
  align: "middle",           /* OPTIONAL : Imgs vertical alignement: top | middle | bottom */
  spaceBetweenItems: "30",   /* OPTIONAL  : Space bewteen each items in px, it must be a multiple of ten */
  speed: "16",               /* OPTIONAL : Speed for a complete loop in seconds */
  stopOnHover: true,         /* OPTIONAL : Stop the animation if user hover the carousel */
  direction: 'backward',     /* OPTIONAL : Scroll direction: backward | forward */
  items: [
    {
      url: "assets/img/flowers.webp",
      alt: "Flowers in a sunny meadow"
    },
    {
      url: "assets/img/car.png",
      alt: "Car driving on an expressway"
    },
  ]
}