lukehill
Mon, 08 Oct 2018 17:25:02 GMT
Hi everyone. I'm trying to get swiper running and for some reason, my images aren't displaying one at a time - I can see chopped off other images in the slideshow on the right and left at all times - I've tried using multiple different code demos from the site, but they're all displaying the same behavior. Here's my code right now:
****
<div class="swiper-container">
<div class="swiper-wrapper">
<!-- Slides -->
<div class="swiper-slide"><img src="img/IMG_1067.jpg"></div>
<div class="swiper-slide"><img src="img/IMG_0695.jpg"></div>
<div class="swiper-slide"><img src="img/IMG_1210.jpg"></div>
...
</div>
</div>
<script src="js/swiper.min.js"></script>
<script>
var swiper = new Swiper('.swiper-container', {
centeredSlides: true,
slidesPerView: 1,
centeredSlides: true,
loop: true,
autoplay: {
delay: 2500,
disableOnInteraction: false,
},
pagination: {
el: '.swiper-pagination',
clickable: true,
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
</script>
****
Can someone help?
Thanks