SharifClick/ svelte-swipe
Need help with svelte-swipe?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.
About the developer
158 Stars 
16 Forks 
MIT License 
277 Commits 
5 Opened issues 
Description
Svelte Swipe with zero dependencies :fire: :boom:
Services available
Contributors list
Readme
Svelte Swipe
Swipable items wrapper component for Svelte :fire: :boom: (zero dependencies - 3.37 KB gzipped)
🚀See it in Action
Installation
npm i -D svelte-swipe
Usage
<swipeitem> <img src="https://github.com/SharifClick/svelte-swipe/raw/master/./images/2.jpg" alt=""> </swipeitem> <swipeitem> <img src="https://github.com/SharifClick/svelte-swipe/raw/master/./images/3.jpg" alt=""> </swipeitem> <swipeitem> <img src="https://github.com/SharifClick/svelte-swipe/raw/master/./images/4.jpg" alt=""> </swipeitem>
Vertical Swipe 🔥
... ...
Pointer event inside Swipe Item
Say Hi...
Programmatically change slides
.... ...
Supports custom thumbnail
🚀See example with custom thumbnail
.... ...
Default css custom properties
:root{
--sv-swipe-panel-height: inherit;
--sv-swipe-panel-width: inherit;
--sv-swipe-panel-wrapper-index: 2;
--sv-swipe-indicator-active-color: grey;
--sv-swipe-handler-top: 0px;
}
Config Props
| Name | Type | Description | Required | Default | | --- | --- | --- | --- | --- | |
is_vertical|
Boolean| allow swipe items vertically | No |
false| |
autoplay|
Boolean| Play items as slide | No |
false| |
showIndicators|
Boolean| appears clickable circle indicators bottom center of item | No |
false| |
transitionDuration|
Number| staying duration of per slide/swipe item | No |
200*ms | |
delay|
Number| transition delay | No |
1000*ms | |
defaultIndex|
Number| initial item index | No |
0|
NPM Statistics
Download stats for this NPM package
Scan qr code to see url in your device
