Minimal Swipeable Gallery In Pure JavaScript – SwiperBox

Category: Javascript , Slideshow | June 20, 2020
Author: vladimirnetworks
Views Total: 852 views
Official Page: Go to website
Last Update: June 20, 2020
License: MIT


Minimal Swipeable Gallery In Pure JavaScript –  SwiperBox


SwiperBox is a tiny JavaScript swiper library to create a touch-enabled, mobile-friendly gallery with support for swipe and drag events.

How to use it:

1. Download the package and insert the SwiperBox.js script into the HTML file.

<script src="SwiperBox.js"></script>

2. Define an array of items to be displayed in the gallery.

myItems = [
  '<div class="myitem"><img src="1.jpg" /></div>',
  '<div class="myitem"><img src="2.jpg" /></div>',
  '<div class="myitem"><img src="3.jpg" /></div>'

3. Initialize the swipeable gallery.

var mySwipe = new SwiperBox({
    items: myItems

4. Append the gallery to anywhere on the webpage. = "400px";

5. Handle the click event on the gallery items.

mySwipe.onClick = function(index,elem) {
  alert("clicked on index"+index);

You Might Be Interested In:

Leave a Reply