갤러리뷰 슬라이딩 문제 (swiper 소스활용)

갤러리뷰 슬라이딩 문제 (swiper 소스활용)

QA

갤러리뷰 슬라이딩 문제 (swiper 소스활용)

본문

1846355798_1653456574.2388.png

 

위의 모습은 갤러리 게시판을 활용하여 swiper 소스로 첨부파일에 이미지를 등록시 슬라이드되어 보여지게 코딩한모습입니다

다른건 다 정상적으로 작동하는데 이상하게 이미지갯수가 6개인데 슬라이드 밑에 점모양을 보면 8개로 설정되어 있고, 아래 썸네일도 우측에 흰색으로 이미지가 2개가 더 등록되어 클릭이됩니다

물론 이미지 등록을 안한상태인것이고, 클릭시 아무것도 보여지지 않고 맨 마지막사진 그대로 입니다

이게 도통 뭐가 문제인지 모르겠어서 혹시 아래의 코딩 소스를 보시고 아시는분이 계시다면

답변해주신다면 매우 감사드리겠습니다 ( 꾸벅 )

 


<!-- 슬라이드영역 -->
    
<div class="slide_all">

    <div class="swiper-container mySwiper3">
      <div class="swiper-wrapper">


<?php
        $v_img_count = count($view['file']);

        if($v_img_count) {

        for ($i=0; $i<=count($view['file']); $i++) {
        echo "<div class=\"swiper-slide\">";
        echo get_file_thumbnail($view['file'][$i]);
        echo "</div>";

        }};

?>

      </div>
       <div class="swiper-button-next"></div>
      <div class="swiper-button-prev"></div>
      <div class="swiper-pagination"></div>
    </div>


    <div thumbsSlider="" class="swiper-container mySwiper4" style="margin-top:20px;">
      <div class="swiper-wrapper slide_th">
      <?php
        $v_img_count = count($view['file']);

        if($v_img_count) {

        for ($i=0; $i<=count($view['file']); $i++) {
        echo "<div class=\"swiper-slide\">";
        echo get_file_thumbnail($view['file'][$i]);
        echo "</div>";

        }};

?>
</div>
</div>


</div>

<style>
.swiper-slide {
height:600px;
overflow:hidden;
}
.slide_th img {
width:150px;
height:100px;
}

</style>
<script>
var swiper = new Swiper(".mySwiper4", {
  
        slidesPerView: 8,
        freeMode: true,
        watchSlidesProgress: true,
      });


      var swiper = new Swiper(".mySwiper3", {
  autoplay: {
    delay: 3000,
  },
      navigation: {
          nextEl: ".swiper-button-next",
          prevEl: ".swiper-button-prev",
        },
        pagination: {
          el: ".swiper-pagination",
          clickable: true,
        },
        loop: true,
effect: "fade",
        speed : 500,
                      thumbs: {
          swiper: swiper,
        },
      });

 

    </script>

    
<!-- 슬라이드영역 -->

 

이 질문에 댓글 쓰기 :

답변 4

for ($i=0; $i<=count($view['file']); $i++) {

이부분이 문제 있어보이네요. 

 

$view['file'] 안에는 처음에 $view['file']['count']에 파일수가 들어가 있습니다. 이것도 카운트돼서 

반복문이 돌아가고 <= 가 아니라 < 를 써야 파일수만큼 돌수 있습니다. 

 

for ($i=0; $i<$view['file']['count']; $i++) {

이렇게 반복문을 돌리서야 할것 같네요. 

        slidesPerView: 8,
이것 때문에 그런거 아닐까요?

답변감사합니다!
해당부분은 위에 슬라이드의 영향을 미치지 않구 아래 썸네일? 갯수가 보여지는것에 영향을 미쳐서 6으로 바꾸어보아도 똑같이 메인이미지의 점 갯수는 8개 똑같더라구요 ㅜ

var swiper = new Swiper(".mySwiper4", {
  
        slidesPerView: 8,
        freeMode: true,
        watchSlidesProgress: true,
      });

 

부분에서 slidesPerView: 8, 를 6으로 변경해보세요

답변감사합니다!
해당부분은 위에 슬라이드의 영향을 미치지 않구 아래 썸네일? 갯수가 보여지는것에 영향을 미쳐서 6으로 바꾸어보아도 똑같이 메인이미지의 점 갯수는 8개 똑같더라구요 ㅜ

답변을 작성하시기 전에 로그인 해주세요.
전체 110,830 | RSS
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIR SOFT