https://github.com/p-m-p/slider
A modern, light weight content slider
https://github.com/p-m-p/slider
carousel javascript react slider slideshow typescript
Last synced: about 2 months ago
JSON representation
A modern, light weight content slider
- Host: GitHub
- URL: https://github.com/p-m-p/slider
- Owner: p-m-p
- License: mit
- Created: 2012-05-23T13:04:30.000Z (over 13 years ago)
- Default Branch: main
- Last Pushed: 2025-05-10T15:40:04.000Z (9 months ago)
- Last Synced: 2025-05-10T15:44:13.892Z (9 months ago)
- Topics: carousel, javascript, react, slider, slideshow, typescript
- Language: TypeScript
- Homepage: https://philparsons.co.uk/slider/
- Size: 66.6 MB
- Stars: 893
- Watchers: 71
- Forks: 235
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
A modern, light weight content slider
## About
BoxSlider is a small library with zero dependencies that provides a light-weight, responsive content slider with
multiple slide transition effects for modern browsers.
The library can be used standalone or via React and web components. View the [website](https://philparsons.co.uk/slider/)
for full details.
## Installation
Install from NPM
```sh
npm install --save @boxslider/slider
```
Use from CDN
```html
import {
BoxSlider,
FadeSlider,
} from 'https://cdn.jsdelivr.net/npm/@boxslider/slider/+esm'
const slider = new BoxSlider(
document.getElementById('slider'),
new FadeSlider(),
)
```
### React
Install via NPM
```sh
npm install --save @boxslider/react
```
```tsx
import { SliderControls, CarouselSlider } from '@boxslider/react'
function MySlider({ children }) {
return (
{children}
)
}
```
View the [React guide](https://philparsons.co.uk/slider/docs/guides/react) for full details
### Web Components
Install via NPM
```sh
npm install --save @boxslider/components
```
Use from CDN
```html