디즈니 어드민에 맞춰 수정
This commit is contained in:
@@ -4176,7 +4176,7 @@
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu ul li button {
|
||||
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu ul li .tab-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
@@ -4188,7 +4188,7 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu ul li button {
|
||||
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu ul li .tab-btn {
|
||||
width: auto;
|
||||
height: 4.3rem;
|
||||
padding: 0 1.6rem 0 1.2rem;
|
||||
@@ -4197,7 +4197,7 @@
|
||||
border-radius: 2.2rem;
|
||||
border: 0.2rem solid rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu ul li button:before {
|
||||
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu ul li .tab-btn:before {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 2.2rem;
|
||||
@@ -4206,16 +4206,16 @@
|
||||
background: url(../images/kia/pdp/display_theme_disney/ico_tab.png) no-repeat center top/100% auto;
|
||||
}
|
||||
}
|
||||
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu ul li.active button {
|
||||
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu ul li.active .tab-btn {
|
||||
color: #fff;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu ul li.active button {
|
||||
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu ul li.active .tab-btn {
|
||||
border: 0;
|
||||
background: linear-gradient(90deg, #ed1c24 0%, #b51016 100%);
|
||||
padding: 0 1.8rem 0 1.4rem;
|
||||
}
|
||||
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu ul li.active button:before {
|
||||
.displayThemeDesney.discover-epic-design .tab-wrap .tab-menu ul li.active .tab-btn:before {
|
||||
background-image: url(../images/kia/pdp/display_theme_disney/ico_tab_active.png);
|
||||
}
|
||||
}
|
||||
@@ -4576,17 +4576,12 @@
|
||||
.displayThemeDesney .btn-zoom {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 1rem;
|
||||
right: 1rem;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 2.4rem;
|
||||
height: 2.4rem;
|
||||
background: url(../images/kia/pdp/display_theme_disney/btn_zoom.png) no-repeat 0 0/100% auto;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.displayThemeDesney .btn-zoom {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.desktop .displayThemeDesney .mobile {
|
||||
display: none;
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
BIN
kr/assets/images/kia/pdp/display_theme_disney/lakers_goodbye.mp4
Normal file
BIN
kr/assets/images/kia/pdp/display_theme_disney/lakers_goodbye.mp4
Normal file
Binary file not shown.
BIN
kr/assets/images/kia/pdp/display_theme_disney/lakers_welcome.mp4
Normal file
BIN
kr/assets/images/kia/pdp/display_theme_disney/lakers_welcome.mp4
Normal file
Binary file not shown.
@@ -4,6 +4,41 @@ $(document).ready(function () {
|
||||
history.scrollRestoration = "manual";
|
||||
}
|
||||
|
||||
$(document).on("click", ".pdpDetail .tab-menu .tab-btn", function () {
|
||||
const $thisBtn = $(this);
|
||||
const $tabWrap = $(".pdpDetail .tab-wrap");
|
||||
const $tabBtns = $(".pdpDetail .tab-menu .tab-btn");
|
||||
const $tabContents = $(".pdpDetail .tab-box");
|
||||
const currentIndex = $tabBtns.index($thisBtn); // index 구하기
|
||||
const currentTabBtnText = $thisBtn.text();
|
||||
|
||||
// 탭 버튼 active 처리
|
||||
$tabBtns.closest("li").removeClass("active");
|
||||
$thisBtn.closest("li").addClass("active");
|
||||
|
||||
// 탭 콘텐츠 show/hide
|
||||
$tabContents.hide().eq(currentIndex).show();
|
||||
|
||||
// 스크롤 이동
|
||||
$("html, body").animate(
|
||||
{
|
||||
scrollTop: $tabWrap.offset().top - 60,
|
||||
},
|
||||
200
|
||||
);
|
||||
|
||||
// 모바일/태블릿 메뉴 닫기
|
||||
if ($("body").hasClass("moblie") || $("body").hasClass("tablet")) {
|
||||
$(".pdpDetail .tab-menu .btn-select").removeClass("open").text(currentTabBtnText);
|
||||
$(".pdpDetail .tab-menu ul").slideUp(200);
|
||||
}
|
||||
});
|
||||
|
||||
$(document).on("click", ".pdpDetail .tab-menu .btn-select", function () {
|
||||
const $this = $(this);
|
||||
$this.toggleClass("open").next().slideToggle(200);
|
||||
});
|
||||
|
||||
//윈도우 사이즈 반응형에 따른 스크립트
|
||||
const body = document.querySelector("body");
|
||||
var targetSize = "";
|
||||
|
||||
@@ -422,13 +422,13 @@
|
||||
<div class="tab-wrap">
|
||||
<div class="tab-menu cont-select">
|
||||
<div class="inner">
|
||||
<button class="btn-select" onclick="pdpDisplayTabMobile()">Marvel’s Avengers Comics</button>
|
||||
<div class="btn-select">Marvel’s Avengers Comics</div>
|
||||
<ul>
|
||||
<li class="active">
|
||||
<button type="button" onclick="pdpDisplayTab(this, '.box1')">Marvel’s Avengers Comics</button>
|
||||
<span class="tab-btn">Marvel’s Avengers Comics</span>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" onclick="pdpDisplayTab(this, '.box2')">Marvel’s Avengers Assemble</button>
|
||||
<span class="tab-btn">Marvel’s Avengers Assemble</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -551,9 +551,7 @@
|
||||
<div class="tit-area" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
|
||||
<h3>
|
||||
What’s <br />Coming Up <br />
|
||||
<span class="next"
|
||||
>Next<i class="speech-bubble">Stay tuned for the next <br />Marvel Display Themes!</i></span
|
||||
>?
|
||||
<span class="next">Next<i class="speech-bubble">Stay tuned for the next <br />Marvel Display Themes!</i></span>?
|
||||
</h3>
|
||||
</div>
|
||||
<div class="image_area">
|
||||
@@ -570,13 +568,13 @@
|
||||
<div class="item welcome-goodbye" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
|
||||
<div class="image_area">
|
||||
<video playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
|
||||
<source src="../assets/images/kia/pdp/display_theme_disney/welcome2.mp4" type="video/mp4" />
|
||||
<source src="../assets/images/kia/pdp/display_theme_disney/lakers_welcome.mp4" type="video/mp4" />
|
||||
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
|
||||
</video>
|
||||
</div>
|
||||
<div class="image_area">
|
||||
<video playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
|
||||
<source src="../assets/images/kia/pdp/display_theme_disney/goodbye2.mp4" type="video/mp4" />
|
||||
<source src="../assets/images/kia/pdp/display_theme_disney/lakers_goodbye.mp4" type="video/mp4" />
|
||||
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
|
||||
</video>
|
||||
</div>
|
||||
@@ -681,9 +679,7 @@
|
||||
<div class="tit-area">
|
||||
<h3>
|
||||
What’s <br />Coming Up <br />
|
||||
<span class="next"
|
||||
>Next<i class="speech-bubble">Stay tuned for the next <br />Marvel Display Themes!</i></span
|
||||
>?
|
||||
<span class="next">Next<em class="speech-bubble">Stay tuned for the next <br />Marvel Display Themes!</em>?</span>
|
||||
</h3>
|
||||
</div>
|
||||
<div class="image_area">
|
||||
|
||||
Reference in New Issue
Block a user