탭메뉴 슬릭슬라이더 이미지 충돌

탭메뉴 슬릭슬라이더 이미지 충돌

QA

탭메뉴 슬릭슬라이더 이미지 충돌

본문

관리자단에서 이미지 추가시 탭메뉴안에 슬릭슬라이더 중복 충돌이 일어나 이미지 자체가 사라지는데 해결 부탁드립니다ㅠㅠ

 


// html 코드

<div class="cont" style="display: none">
   <th:block th:each="store: ${storeList}">
      <div class="inner clearfix" style="display: none;"
          data-th-id="${store?.seq}" data-th-if="${#stringUtil.equals(store?.expsYn, #mapUtil.getKey(map.expsYnMap, '노출'))}" >
         <div class="left-area">
            <ul>
               <li class="name" data-th-text="${store?.nm}"></li>
               <li class="location" data-th-text="${store?.addr + store?.dtlAddr}"></li>
               <li class="report tel" data-th-text="|전화번호 : ${store?.repTel}|"></li>
            </ul>
         </div>
            <div id="slick" class="right-area" th:if="${store?.storeImages?.size() > 0}">
               <th:block  th:each="storeImage : ${store?.storeImages}">
                  <img class="details-img" th:src="${storeImage?.img}" alt="매장 상세 이미지">
               </th:block>
            </div>
      </div>
   </th:block>
</div>

 

 


// 탭메뉴

function showStoreDetail(storeIdx) {
   const storeDetailDiv = $('#'+storeIdx);
   $('.cont').show();
   storeDetailDiv.fadeIn(200);
   $('.cont >').not(storeDetailDiv).fadeOut(200);

}


 
//슬릭슬라이더

$("#slick-img").slick({
   infinite: true,
   customPaging: function (slider, i) {
      return  (i + 1) + ' / ' + slider.slideCount;
   },
   variableWidth:true,
   dots: true,
   setPosition: 0,
   slidesToShow:1,
   slidesToScroll: 1

});

 

이 질문에 댓글 쓰기 :

답변 1

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

회원로그인

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