最简单模拟swiper功通的代码

<div class="swiper-container">

    <div class="swiper-wrapper">
        <div class="swiper-slide">slider1</div>
        <div class="swiper-slide">slider2</div>
        <div class="swiper-slide">slider3</div>
        <div class="swiper-slide">slider4</div>
        <div class="swiper-slide">slider5</div>
        <div class="swiper-slide">slider6</div>
        <div class="swiper-slide">slider7</div>
        <div class="swiper-slide">slider8</div>
        <div class="swiper-slide">slider9</div>
        <div class="swiper-slide">slider10</div>
        <div class="swiper-slide">slider11</div>
        <div class="swiper-slide">slider12</div>
    </div>
</div>
<div class="navigation">
    <button onclick="prev()">Previous</button>
    <button onclick="next()">Next</button>
</div>
<script>
    x = 0;
    function prev() {
        x = x + 500;
        y = x + 'px'

        // document.querySelector('.swiper-wrapper').style = 'transition-duration: 300ms; transform: translate3d(' + y + ', 0px, 0px);'
        document.querySelector('.swiper-wrapper').style = 'transition-duration: 300ms; transform: translateX(' + y + ');'
    }
    function next() {
        x = x - 500;
        y = x + 'px'
        document.querySelector('.swiper-wrapper').style = 'transition-duration: 300ms; transform: translateX(' + y + ');'

    }
</script>
<style>
    body {
        box-sizing: border-box;
    }

    .swiper-container {
        display: flex;
        overflow: hidden;
        width: 500px;
        height: 700px;
        border: 1px solid red;
        margin: auto;
        box-sizing: border-box;
    }

    .swiper-wrapper {
        width: 100%;
        height: 100%;
        align-items: center;
        display: flex;
    }

    .swiper-slide {
        width: 500px;
        height: 700px;
        border: 1px solid green;
        flex-shrink: 0;
        box-sizing: border-box;
    }

    .navigation {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 20px;


    }

    .navigation button {
        width: 100px;
    }
</style>