how can i resize the images size in swiperjs

user_13561400 0
Viewed 1912

My layout is no problem but I wanna adjust the size of the image, I tried to make images set to width: 1130px but cannot responsive... how to fix it.

My Swiper code:

new Swiper(".mySwiper", {
    slidesPerView: 3,
    centeredSlides: true,
    spaceBetween: 10,
    loop: true,
    pagination: {
        el: ".swiper-pagination",
        clickable: true,
    },
    navigation: {
        nextEl: ".swiper-button-next",
        prevEl: ".swiper-button-prev",
    },
    breakpoints: {
        1400: {
            slidesPerView: 2,
        },
        640: {
            slidesPerView: 2,
        },
        320: {
            slidesPerView: 1,
        }
    }
});

enter image description here

swiper.js layout css html
1 Answers

Don't set fixed width for images. Better, insert img in div and set to img following properties:

width: 100%;
display: block;

Therefore, if you change width of layout or div, images width will fit to parent. Images always should have full width for responsive view.

user_73784060
Related