Ребят почему не работают стрелки в слайдере?

Question

[semensx]

использую swiper

<link
  rel="stylesheet"
  href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.4.1/css/swiper.min.css"
/>
<style>
.swiper-container.one {
    padding-top: 40px;
    text-align: center;
}

.swiper-container.one .swiper-slide {
    padding: 0 43px;
}

.swiper-container {
    width: 100%;
    padding-bottom: 60px;
}

.swiper-slide img {
    display: block;
    margin: auto;
    width: 100%;
}

.swiper-slide {
    width: 390px;
    height: auto;
    padding: 0 15px;
}
.two .swiper-slide {
    width: 300px;
}
.swiper-slide img {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}


.swiper-slide.swiper-slide-active .slider-image:hover .preview-icon {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    z-index: 1;
}
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.4.1/js/swiper.min.js"></script>

<script>

var swiper = new Swiper( '.swiper-container.two', {
    pagination: '.swiper-pagination',
    paginationClickable: true,
    effect: 'coverflow',
    loop: true,
  navigation: {
    nextEl: '.swiper-button-next',
    prevEl: '.swiper-button-prev',
  },
    centeredSlides: true,
    slidesPerView: 'auto',
    coverflow: {
      rotate: 0,
      stretch: 100,
      depth: 150,
      modifier: 1.5,
      slideShadows : false,
    },
    
  

} );
</script>

Comments

[semensx]

https://codepen.io/shamim539/pen/vdaqQG источник

Answer 1

[RomyGalaxy]

Пробуйте работать с актуальной версией https://cdn.jsdelivr.net/npm/swiper@9/swiper-bundl...
С ней проблем не возникает, использую в каждом проекте

Comments

[semensx]

просто я вот вставляю актуальную версию и все летит