Get started with swipe CDN
MIT licensed
Swipe is a lightweight library for creating touch-swipe gestures on desktop and mobile browsers.
Tags:- swipe
- touch
- mobile
- slider
Stable version
Copied!
How to start using swipe CDN
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/swipe.min.js"></script>
</head>
<body>
<div class="swipe-container">
<div class="swipe-wrapper">
<div class="swipe-slide">Slide 1</div>
<div class="swipe-slide">Slide 2</div>
<div class="swipe-slide">Slide 3</div>
</div>
<button class="swipe-button-prev">Previous</button>
<button class="swipe-button-next">Next</button>
</div>
<script>
new Swipe(document.querySelector('.swipe-container'), {
// Optional settings
continuous: true,
disableMouse: false,
preventInteractionOnTransition: false,
resistance: 0.2,
resistanceRatio: 0.2,
reloadOnVisibilityChange: true,
followFinger: false,
threshold: 50,
transitionEndCallback: function() {
// Callback when transition ends
},
transitionStartCallback: function() {
// Callback when transition starts
},
callbacks: {
slide: function(index, element) {
// Called every time a slide is changed
console.log('Current slide index:', index);
}
}
});
</script>
</body>
</html>
Copied!
Copied!