@jocampo3/slider 1.0.1 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +48 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1 +1,48 @@
|
|
|
1
|
-
# slider
|
|
1
|
+
# @jocampo3/slider
|
|
2
|
+
|
|
3
|
+
A lightweight, minimal carousel built with CSS and vanilla JavaScript.
|
|
4
|
+
|
|
5
|
+
## Why?
|
|
6
|
+
|
|
7
|
+
Tired of bulky external NPM packages? This package delivers essential carousel functionality with minimal JavaScript, keeping your projects fast and clean.
|
|
8
|
+
|
|
9
|
+
## Install
|
|
10
|
+
|
|
11
|
+
```bash
|
|
12
|
+
npm install @jocampo3/slider
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
## Usage
|
|
16
|
+
|
|
17
|
+
### Single Slider
|
|
18
|
+
|
|
19
|
+
```javascript
|
|
20
|
+
import Slider from '@jocampo3/slider';
|
|
21
|
+
import '@jocampo3/slider/styles.css';
|
|
22
|
+
|
|
23
|
+
const interval = 3500; // update to your interval value
|
|
24
|
+
const slider = new Slider('#my-slider', interval);
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
### Multiple Sliders
|
|
28
|
+
|
|
29
|
+
```javascript
|
|
30
|
+
import Slider from '@jocampo3/slider';
|
|
31
|
+
import '@jocampo3/slider/styles.css';
|
|
32
|
+
|
|
33
|
+
const interval = 3500; // update to your interval value
|
|
34
|
+
const slides = document.querySelectorAll('.slideshow');
|
|
35
|
+
|
|
36
|
+
slides.forEach(s => new Slider(s, interval));
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
## Features
|
|
40
|
+
|
|
41
|
+
- Lightweight (~1KB gzipped)
|
|
42
|
+
- Zero dependencies
|
|
43
|
+
- CSS-driven animations
|
|
44
|
+
- Fully customizable via CSS variables
|
|
45
|
+
|
|
46
|
+
## License
|
|
47
|
+
|
|
48
|
+
ISC
|