2026, 새로운 도약을 시작합니다.

Swiper js 스와이퍼 보이는 슬라이드 영역 정렬 문의드립니다.

1년 전 조회 13,588

안녕하세요.

Swiper cdn을 사용해서 스와이퍼를 제작던 중 해당 디자인처럼 구현이 되지않아 문의드립니다.

제가 생각하는 슬라이드의 형태는 액티브되는 슬라이드와 그 다음에 보여지는 슬라이드가 같이 중앙의 1400px의 영역에 보이고 1400px 영역을 중심으로 돌아가는 형태를 생각했습니다.

(스와이퍼의 전체의 영역은 100%)

238580039_1726056471.7391.png

그런데 현재 구현되는 슬라이드의 형태는 아래의 형태입니다. 238580039_1726056679.9048.jpg

현재의 소스 코드는 아래의 내용입니다.

Copy








  

  

  Document

 

  

  

 

  

    .promotion .swiper{

 

    }

    .promotion .swiper .swiper-wrapper{

      width: 1400px;

      margin: 0 auto;

      background-color: yellow;

    }

    .promotion .swiper .swiper-wrapper .swiper-slide{

      width: 699px;

      height: 644px;

      background-color:pink;

      opacity: .8;

    }

  





  

    

      

        Slide 1

        Slide 2

        Slide 3

        Slide 4

        Slide 5

        Slide 6

        Slide 7

        Slide 8

        Slide 9

      

    

  

 

    

    

    

 

    

      new Swiper ('.promotion .swiper', {

      spaceBetween:1,

      slidesPerView:'auto',

      loop:true,

      });

    





부탁드립니다.!!

답변 1개

옵션중에 한번에 이동하는 슬라이더 갯수가 있습니다.

slidesPerGroup: 2,

https://ktsmemo.cafe24.com/s/SwiperJS/367

참고하셔서 수정하세요.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인
🐛 버그신고