테스트 사이트 - 개발 중인 베타 버전입니다

스와이퍼 네비게이터 항상 보이게하기 채택완료

ZDZ 1년 전 조회 1,676

안녕하세요, 스와이퍼에서 넘길 페이지가 없어도 항상 네비게이터가 보이게 하고 싶습니다.

 

</p>

<p><script>

  var swiper = new Swiper(".swiperTop", {

    slidesPerView: 3,

    spaceBetween: 30,

    freeMode: true,

    navigation: {

        nextEl: ".swiper-button-next",

        prevEl: ".swiper-button-prev",

      },

  });

</script></p>

<p>

 

이런 코드를 사용해서, 총 3장의 페이지가 보이게하고 4번째 슬라이드부터 안나오게하는.. 그런 느낌인데요

 

http://sir.kr/data/editor/2401/1889326059_1706594695.25.png" width="190" />

슬라이드를 3개만 넣으면 네비게이터가 안 보입니다. (사진 위쪽 참고, 아래쪽은 4 슬라이드 이상 존재하는스와이퍼 입니다.) 4번째 슬라이드를 넣지 않아도 네비게이터가 표시되게 할 수 있을까요? 

 

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

답변 2개

채택된 답변
+20 포인트
M
1년 전

<style> .swiper-button-prev, .swiper-button-next { display: block !important; } </style>

이렇게 css를 넣으시면 무조건 보이실껍니다.


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

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

주사쟝
1년 전

loop: true, 를 추가하세요.

 

</p>

<pre>
<code><script>
  var swiper = new Swiper(".swiperTop", {
    slidesPerView: 3,
    spaceBetween: 30,
    freeMode: true,
    loop: true,
    navigation: {
        nextEl: ".swiper-button-next",
        prevEl: ".swiper-button-prev",
      },
  });
</script></code></pre>

<p> </p>

<p>

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

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

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

로그인