스토어이용안애 추가

This commit is contained in:
hyeonggil
2024-07-03 21:30:32 +09:00
parent 0eb21578fa
commit c85ccb153b
11 changed files with 107 additions and 5 deletions

View File

@@ -295,9 +295,24 @@
</ul>
</div>
</div>
<div class="tabWarp">
<a href="#ongoing" class="tabActive"">일반</a>
<a href="#ended">테마형</a>
<a href="#winner" class="">이용권형</a>
</div>
<script>
$(document).on("click",".tabWarp a",function(event){
$(".tabWarp a").removeClass('tabActive')
$(this).addClass('tabActive');
var tabIndex = $(this).index() +1;
$('.storeGuideItem:nth-of-type('+tabIndex+')').show().siblings('.storeGuideItem').hide();
});
</script>
<section class="storeGuideItem">
<header>
<h3 class="titleCase02">디지털 사양 설치</h3>
<header class="mgt30">
<h3 class="titleCase02">일반 디지털 사양 설치</h3>
<strong>6 STEP</strong>
</header>
@@ -347,6 +362,58 @@
<div class="swiper-button-next btnNextSlide1 case"></div>
<div class="swiper-button-prev btnPrevSlide1 case"></div>
</section>
<section class="storeGuideItem" style="display: none;">
<header class="mgt30">
<h3 class="titleCase02">테마형 디지털 사양 설치</h3>
<strong>3 STEP</strong>
</header>
<div class="swiper swiper2">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<img class="noBorder" src="../assets/images/kia/contents/guideStoreInstallationNew02_1.jpg" alt="차량에 탑승해서 시동을 겁니다.">
<b>STEP 01</b>
<p class="caseBlack">인포테인먼트 시스템 설정 화면구성 메뉴에 진입해주세요.</p>
</li>
<li class="swiper-slide" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<img class="noBorder" src="../assets/images/kia/contents/guideStoreInstallationNew02_2.jpg" alt="설치 진행을 위해 AVNT 안내 메시지 확인 후 시동을 끕니다.">
<b>STEP 02</b>
<p class="caseBlack">구매한 테마 사양 좌측 위 다운로드 버튼을 눌러주세요.</p>
</li>
<li class="swiper-slide" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<img class="noBorder" src="../assets/images/kia/contents/guideStoreInstallationNew02_3.jpg" alt="시동을 끄면 AVNT 안내가 나오면 설치 진행을 위해 '지금 설치'를 클릭해주십시오.">
<b>STEP 03</b>
<p class="caseBlack">
약 5분후 설치가 완료되면, 예를 눌러 테마를 적용해주세요.(재시동 필요)
</p>
</li>
</ul>
<div class="swiper-scrollbar"></div>
<div class="swiper-scrollbar-after-space" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"></div>
</div>
<div class="swiper-button-next btnNextSlide1 case"></div>
<div class="swiper-button-prev btnPrevSlide1 case"></div>
</section>
<section class="storeGuideItem" style="display: none;">
<header class="mgt30">
<h3 class="titleCase02">이용권형 디지털 사양 설치</h3>
<strong>1 STEP</strong>
</header>
<div class="swiper swiper3">
<ul class="swiper-wrapper caseWide">
<li class="swiper-slide" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
<img class="noBorder" src="../assets/images/kia/contents/guideStoreInstallationNew03_1.jpg" alt="차량에 탑승해서 시동을 겁니다.">
<b>STEP 01</b>
<p class="caseBlack">이용권 사양은 별도 설치없이 디지털 사양을 구매하시면 해당 메뉴에 진입 가능합니다.</p>
</li>
</ul>
<div class="swiper-scrollbar"></div>
<div class="swiper-scrollbar-after-space" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"></div>
</div>
<div class="swiper-button-next btnNextSlide1 case"></div>
<div class="swiper-button-prev btnPrevSlide1 case"></div>
</section>
<section class="caseService">
<header>
@@ -502,6 +569,30 @@
prevEl: ".btnPrevSlide1",
},
});
var swiper2 = new Swiper(".swiper2", {
slidesPerView: "auto",
//freeMode: true,
scrollbar: {
el: ".swiper-scrollbar",
hide: true,
},
navigation: {
nextEl: ".btnNextSlide1",
prevEl: ".btnPrevSlide1",
},
});
var swiper3 = new Swiper(".swiper3", {
slidesPerView: "auto",
//freeMode: true,
scrollbar: {
el: ".swiper-scrollbar",
hide: true,
},
navigation: {
nextEl: ".btnNextSlide1",
prevEl: ".btnPrevSlide1",
},
});
</script>
</body>
</html>