Slider with Swiper JS


<link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.17.1/themes/prism.min.css" rel="stylesheet" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/5.4.5/css/swiper.min.css">
<link href="https://laarmwork.arnaudjacques.fr/res/css/button.css" rel="stylesheet">
<script src="https://laarmwork.arnaudjacques.fr/res/js/laarmwork.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.17.1/components/prism-core.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.17.1/plugins/autoloader/prism-autoloader.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/5.4.5/js/swiper.min.js"></script>
            

Image 1

Image 2

Image 3


<div class="swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide" style="background-image: url(https://source.unsplash.com/random?sig=24);">
            <h2>Image 1</h2>
        </div>
        <div class="swiper-slide" style="background-image: url(https://source.unsplash.com/random?sig=53);">
            <h2>Image 2</h2>
            </div>
            <div class="swiper-slide" style="background-image: url(https://source.unsplash.com/random?sig=52);">
                <h2>Image 3</h2>
            </div>
        </div>
        <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div>
        <div class="swiper-pagination"></div>
    </div>
</div>
<script>
    var Swipes = new Swiper('.swiper-container', {
        loop: true,
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
        pagination: {
            el: '.swiper-pagination',
        },
    });
</script>