JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://mctenshi.github.io/infinite-swipe/swipe.js"></script>
<link rel="stylesheet" href="https://mctenshi.github.io/infinite-swipe/swipe.css">
<div class="stage">
    <ul class="target">
        <li><img alt="" src="https://api.recopick.com/i/prd_sample/1.png" width="300" height="300"></li>
        <li><img alt="" src="https://api.recopick.com/i/prd_sample/3.png" width="300" height="300"></li>
        <li><img alt="" src="https://api.recopick.com/i/prd_sample/5.png" width="300" height="300"></li>
    </ul>
</div>

CSS

ul, li {
    margin: 0;
    padding: 0;
    list-style: none;
}
.stage {
    width: 300px;
    height: 400px;
    overflow: hidden;
    background: #ddd;
}
.target {
    width: 900px;
}
.target li {
    float: left;
}

JavaScript

$('.stage').infiniteSwipe({
    $target: $('.target'),
    total: 3,
    infinite: true
});