angular-glide

A lightweight image carousel built for angular.

Features

• Includes webpack-dev-server for ease of use in development
• Built in tests with Karma
• See projects example folder for more detailed usage.

Installation

$ npm install angular-glide

Usage

Pass in your images for the carousel in the controller

import "angular-glide";

angular
  .module("example", ["ngGlide"])
  .controller("someController", $scope => {
    $scope.images = [
      "http://image1.jpg",
      "http://image2.jpg",
      "http://image3.jpg"
    ];
  });

Add the module into your template

<div ng-controller="someController">
  <ng-glide 
    images="images" 
    infinite="true" 
    autoplay="false" 
    autoplayspeed="2000" />
</div>

Source the CSS styles located at lib/ng-glide.css.

Options

| option | type | description | |------------ |-----------|---------------------------------------| |images |array | the images to be displayed by component | |infinite |bool | carousel loops infinitely. Defaults to true | |autoplay |bool | carousel will auto-rotate slides. Defaults to false | |autoplayspeed|int | The rate of change of slides in autoplay mode. Defined in ms. Defaults to 2000ms |

Development

Install dependencies:

$ npm install

Run the development server at http://localhost:8080:

$ npm start

Run tests and watch for code changes using karma:

$ npm test

Lint src and test files:

$ npm run lint

License

MIT