{"id":15910513,"url":"https://github.com/manishjanky/ngx-slides","last_synced_at":"2025-08-14T22:32:47.732Z","repository":{"id":57151066,"uuid":"126137454","full_name":"manishjanky/ngx-slides","owner":"manishjanky","description":"ngx-slides is a lightweight slideshow component for Anguar 4 applications and fully configurable.","archived":false,"fork":false,"pushed_at":"2018-03-31T06:54:14.000Z","size":1546,"stargazers_count":2,"open_issues_count":1,"forks_count":2,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-11-15T08:54:38.227Z","etag":null,"topics":["angular","angular-component","angular4","component","library","ngx-slides","slide","slideshow"],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/manishjanky.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-03-21T07:06:58.000Z","updated_at":"2020-03-04T06:08:35.000Z","dependencies_parsed_at":"2022-08-24T10:20:34.922Z","dependency_job_id":null,"html_url":"https://github.com/manishjanky/ngx-slides","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/manishjanky%2Fngx-slides","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/manishjanky%2Fngx-slides/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/manishjanky%2Fngx-slides/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/manishjanky%2Fngx-slides/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/manishjanky","download_url":"https://codeload.github.com/manishjanky/ngx-slides/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":229827694,"owners_count":18130390,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","angular-component","angular4","component","library","ngx-slides","slide","slideshow"],"created_at":"2024-10-06T15:07:41.254Z","updated_at":"2024-12-15T20:42:56.726Z","avatar_url":"https://github.com/manishjanky.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ngx-slides\r\n\r\n[![GitHub license](https://img.shields.io/github/license/manishjanky/ngx-slides.svg)](https://github.com/me-and/mdf/blob/master/LICENSE)\r\n[![npm](https://img.shields.io/npm/v/ngx-slides.svg)]()\r\n[![Build Status](https://travis-ci.org/manishjanky/ngx-slides.svg?branch=master)](https://travis-ci.org/manishjanky/ngx-slides)\r\n[![Codecov branch](https://codecov.io/gh/manishjanky/ngx-slides/branch/master/graphs/badge.svg)]()\r\n[![npm](https://img.shields.io/npm/dt/ngx-slides.svg)]()\r\n[![GitHub top language](https://img.shields.io/github/languages/top/manishjanky/ngx-slides.svg)]()\r\n[![GitHub code size in bytes](https://img.shields.io/github/languages/code-size/manishjanky/ngx-slides.svg)]()\r\n[![GitHub issues](https://img.shields.io/github/issues/manishjanky/ngx-slides.svg)]()\r\n[![GitHub closed issues](https://img.shields.io/github/issues-closed/manishjanky/ngx-slides.svg)]()\r\n[![GitHub contributors](https://img.shields.io/github/contributors/manishjanky/ngx-slides.svg)]()\r\n\r\n`ngx-slides` is a lightweight slideshow component for Anguar 4 applications and fully configurable.\r\n\r\n## Features\r\n* Autoplay\r\n* Navigation buttons\r\n* Customizable delay time, height, widths \r\n\r\n## Examples\r\n\r\n* [demo-page](https://manishjanky.github.io/ngx-slides/)\r\n\r\n## Installation\r\n\r\n* `npm install ngx-slides`\r\n\r\n### Using with webpack and tsc builds/ angular-cli builds\r\n\r\n* import `NgxSlidesModule` into your app.module;\r\n````\r\nimport { NgxSlidesModule } from 'ngx-slides'\r\n````\r\n* add `NgxSlidesModule` to the imports of your NgModule:\r\n`````\r\n@NgModule({\r\n  imports: [\r\n    ...,\r\n    NgxSlidesModule\r\n  ],\r\n  ...\r\n})\r\nclass YourModule { ... }\r\n`````\r\n\r\n* use `\u003cngx-slides\u003e\u003c/ngx-slides\u003e` in your templates to add pagination in your view like below\r\n\r\n````\r\n\u003cngx-slides [slideImages]=\"slides\" [config]=\"config\"\u003e\u003c/ngx-slides\u003e\r\n````\r\n\r\n## Config\r\n\r\n### Input\r\n\r\n* `slideImages: any[]` - An array of objects that contains the image url and captions.\r\n* `config: {}` - Object with configurationn values for the slides with below format.\r\n\r\n````\r\nslideImages = [\r\n    {\r\n      image: '/assets/images/image3.jpeg', //path to image\r\n      title: 'Image1' //caption for image\r\n    }\r\n]\r\n````\r\n````\r\nconfig = {\r\n        width:\"800px\", //width of slides defaults to 800px\r\n        height:\"300px\" //height of slides defaults to 300px\r\n        autoPlay:false //autoplay required or not defaults to false\r\n        delay: 3000 // delay for autoplay\r\n      }\r\n````\r\n\r\n## Help Improve\r\n\r\nFound a bug or an issue with this? [Open a new issue](https://github.com/manishjanky/ngx-slides/issues) here on GitHub.\r\n\r\n## Contributing to this project\r\n\r\nAnyone and everyone is welcome to contribute. Please take a moment to\r\nreview the [guidelines for contributing](CONTRIBUTING.md).\r\n\r\n* [Bug reports](CONTRIBUTING.md#bugs)\r\n* [Feature requests](CONTRIBUTING.md#features)\r\n* [Pull requests](CONTRIBUTING.md#pull-requests)\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmanishjanky%2Fngx-slides","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmanishjanky%2Fngx-slides","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmanishjanky%2Fngx-slides/lists"}