pdp/사양안내 업로드
This commit is contained in:
@@ -1940,6 +1940,12 @@
|
||||
width: 100%;
|
||||
max-width: 192rem;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.displayTheme .visualBg {
|
||||
overflow: hidden;
|
||||
height: 143vw;
|
||||
}
|
||||
}
|
||||
.displayTheme .visualBg img {
|
||||
width: 100%;
|
||||
}
|
||||
@@ -2255,6 +2261,18 @@
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
.displayTheme.welcome-goodbye {
|
||||
margin-top: 8rem;
|
||||
}
|
||||
.displayTheme.welcome-goodbye .comp_body + .comp_body {
|
||||
margin-top: 10rem;
|
||||
}
|
||||
.displayTheme.welcome-goodbye .comp_body .text_area {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
.displayTheme.welcome-goodbye .comp_body video {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.displayThemeDtl .swiper-navigation > * {
|
||||
top: 210px;
|
||||
@@ -2275,9 +2293,9 @@
|
||||
.displayThemeDtl .swiper-pagination {
|
||||
top: 46.4rem;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
@media (max-width: 1200px) {
|
||||
.displayThemeDtl .swiper-pagination {
|
||||
top: 13.4rem;
|
||||
top: 36.4vw;
|
||||
}
|
||||
}
|
||||
.displayThemeDtl .swiper-pagination .swiper-pagination-bullet {
|
||||
@@ -2550,6 +2568,11 @@
|
||||
border-radius: 0.8rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.inCarGame + .comp_1x_b_v_s_b .image_area video {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.inCarGame + .comp_1x_b_v_s_b {
|
||||
margin-top: 4rem;
|
||||
@@ -2617,22 +2640,56 @@
|
||||
margin-top: 0.7rem;
|
||||
}
|
||||
.inCarGame .inCarGameDtlThumb .swiper-slide {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
height: 14.85rem;
|
||||
border-radius: 0.8rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.inCarGame .inCarGameDtlThumb .swiper-slide {
|
||||
height: 4.5rem;
|
||||
}
|
||||
}
|
||||
.inCarGame .inCarGameDtlThumb .swiper-slide.video-slideThumb:before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
z-index: 2;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 60px;
|
||||
height: 61px;
|
||||
background: url(../images/kia/pdp/in_car_game/btn_play.png) no-repeat center/contain;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.inCarGame .inCarGameDtlThumb .swiper-slide.video-slideThumb:before {
|
||||
width: 30px;
|
||||
height: 31px;
|
||||
opacity: 0.75;
|
||||
}
|
||||
}
|
||||
.inCarGame .inCarGameDtlThumb .swiper-slide img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
border-radius: 0.8rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
.inCarGame .inCarGameDtlThumb .swiper-slide video {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
}
|
||||
.inCarGame .inCarGameDtlThumb .swiper-slide:after {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 3;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 0.8rem;
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -1843,6 +1843,10 @@
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
max-width: 192rem;
|
||||
@include maxtablet{
|
||||
overflow: hidden;
|
||||
height: 143vw;
|
||||
}
|
||||
img {
|
||||
width: 100%;
|
||||
&.mobile {display: none;}
|
||||
@@ -2156,6 +2160,21 @@
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
&.welcome-goodbye {
|
||||
margin-top:8rem;
|
||||
.comp_body {
|
||||
&+.comp_body {
|
||||
margin-top: 10rem;
|
||||
}
|
||||
.text_area {
|
||||
margin-bottom:2rem;
|
||||
}
|
||||
video {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.displayThemeDtl {
|
||||
@@ -2181,8 +2200,12 @@
|
||||
|
||||
.swiper-pagination {
|
||||
top:46.4rem;
|
||||
// top:36.4vw;
|
||||
@media(max-width: 1200px){
|
||||
top:36.4vw;
|
||||
}
|
||||
@include maxtablet{
|
||||
top: 13.4rem;
|
||||
// top: 14.4rem;
|
||||
}
|
||||
.swiper-pagination-bullet {
|
||||
opacity: 1;
|
||||
@@ -2468,6 +2491,11 @@
|
||||
border-radius: 0.8rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
@include maxtablet{
|
||||
video {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
@include maxtablet{
|
||||
margin-top:4rem;
|
||||
@@ -2502,21 +2530,53 @@
|
||||
.inCarGameDtlThumb {
|
||||
margin-top: .7rem;
|
||||
.swiper-slide {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
height: 14.85rem;
|
||||
border-radius: 0.8rem;
|
||||
@include maxtablet{
|
||||
height: 4.5rem;
|
||||
}
|
||||
cursor: pointer;
|
||||
&.video-slideThumb {
|
||||
&:before {
|
||||
content:"";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top:50%;left:50%;
|
||||
z-index: 2;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 60px;
|
||||
height: 61px;
|
||||
background: url(../images/kia/pdp/in_car_game/btn_play.png) no-repeat center / contain;
|
||||
|
||||
@include maxtablet{
|
||||
width: 30px;
|
||||
height: 31px;
|
||||
opacity: .75;
|
||||
}
|
||||
}
|
||||
}
|
||||
img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
border-radius: 0.8rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
video {
|
||||
position: absolute;
|
||||
top:50%;
|
||||
transform: translateY(-50%);
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
}
|
||||
&:after {
|
||||
content:"";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top:0;
|
||||
left:0;
|
||||
z-index: 3;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: .8rem;
|
||||
|
||||
BIN
assets/images/kia/pdp/display_theme/.DS_Store
vendored
BIN
assets/images/kia/pdp/display_theme/.DS_Store
vendored
Binary file not shown.
BIN
assets/images/kia/pdp/display_theme/NBA_Display_Theme_Intro.mp4
Normal file
BIN
assets/images/kia/pdp/display_theme/NBA_Display_Theme_Intro.mp4
Normal file
Binary file not shown.
BIN
assets/images/kia/pdp/display_theme/celtics_goodbye.mp4
Normal file
BIN
assets/images/kia/pdp/display_theme/celtics_goodbye.mp4
Normal file
Binary file not shown.
BIN
assets/images/kia/pdp/display_theme/celtics_welcome.mp4
Normal file
BIN
assets/images/kia/pdp/display_theme/celtics_welcome.mp4
Normal file
Binary file not shown.
BIN
assets/images/kia/pdp/display_theme/lakers_goodbye.mp4
Normal file
BIN
assets/images/kia/pdp/display_theme/lakers_goodbye.mp4
Normal file
Binary file not shown.
BIN
assets/images/kia/pdp/display_theme/lakers_welcome.mp4
Normal file
BIN
assets/images/kia/pdp/display_theme/lakers_welcome.mp4
Normal file
Binary file not shown.
BIN
assets/images/kia/pdp/display_theme/producy-temp1.png
Normal file
BIN
assets/images/kia/pdp/display_theme/producy-temp1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 342 KiB |
BIN
assets/images/kia/pdp/in_car_game/btn_play.png
Normal file
BIN
assets/images/kia/pdp/in_car_game/btn_play.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
BIN
assets/images/kia/pdp/in_car_game/theme2-1.mp4
Executable file
BIN
assets/images/kia/pdp/in_car_game/theme2-1.mp4
Executable file
Binary file not shown.
BIN
assets/images/kia/pdp/in_car_game/theme3-1.mp4
Executable file
BIN
assets/images/kia/pdp/in_car_game/theme3-1.mp4
Executable file
Binary file not shown.
BIN
assets/images/kia/pdp/in_car_game/theme6-1.mp4
Executable file
BIN
assets/images/kia/pdp/in_car_game/theme6-1.mp4
Executable file
Binary file not shown.
BIN
assets/images/kia/pdp/in_car_game/theme8-1.mp4
Executable file
BIN
assets/images/kia/pdp/in_car_game/theme8-1.mp4
Executable file
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 165 KiB After Width: | Height: | Size: 130 KiB |
@@ -267,6 +267,7 @@ $(document).ready(function() {
|
||||
pdpInCarGameSwiper()
|
||||
pdpInCarGameSwiperDtl();
|
||||
pdpIntro();
|
||||
|
||||
flagScroll = false;
|
||||
}
|
||||
}
|
||||
@@ -447,7 +448,7 @@ function pdpInCarGameSwiper(){
|
||||
// },
|
||||
on: {
|
||||
init: function () {
|
||||
console.log('pdpInCarGameSwiper 실행한다')
|
||||
// console.log('pdpInCarGameSwiper 실행한다')
|
||||
},
|
||||
},
|
||||
});
|
||||
@@ -463,9 +464,10 @@ function pdpInCarGameSwiper(){
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
flagScroll = false;
|
||||
}
|
||||
|
||||
let inCarGameSwiper;
|
||||
function pdpInCarGameSwiperDtl(){
|
||||
if ($('.inCarGameDtl').length > 0) {
|
||||
var inCarGameSwiper = new Swiper(".inCarGameDtlThumb", {
|
||||
@@ -483,9 +485,16 @@ function pdpInCarGameSwiperDtl(){
|
||||
thumbs: {
|
||||
swiper: inCarGameSwiper,
|
||||
},
|
||||
on: {
|
||||
init: function () {
|
||||
$(document).on("click", ".inCarGame .dtthumb", function() {
|
||||
inCarGameSwiper.slideTo(0);
|
||||
inCarGameSwiper2.slideTo(0);
|
||||
});
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
flagScroll = false;
|
||||
}
|
||||
$(document).on("click", ".inCarGame .dtthumb", function(e) {
|
||||
@@ -504,15 +513,42 @@ $(document).on("click", ".inCarGame .dtthumb", function(e) {
|
||||
}, 200);
|
||||
|
||||
$(".inCarGame .themeImg").each(function(e){
|
||||
const idx = e+1;
|
||||
const idx = e+2;
|
||||
const src = $(this).attr("src");
|
||||
const lastIndex = src.lastIndexOf("/");
|
||||
const pathWithoutFileName = src.substring(0, lastIndex);
|
||||
|
||||
$(this).attr("src", `${pathWithoutFileName}/${dtlImgPath}-${idx}.png`);
|
||||
});
|
||||
$(".inCarGame .themeImgThumb").each(function(e){
|
||||
$(".inCarGame .video-slide").each(function(e){
|
||||
const idx = e+1;
|
||||
const src = $(this).find(".themeVideo").attr("src");
|
||||
const lastIndex = src.lastIndexOf("/");
|
||||
const pathWithoutFileName = src.substring(0, lastIndex);
|
||||
const videoEle = `
|
||||
<video loop="" muted="" playsinline="" autoplay="" poster="${pathWithoutFileName}/${dtlImgPath}-1.png">
|
||||
<source src="${pathWithoutFileName}/${dtlImgPath}-1.mp4" type="video/mp4" class="themeVideo">
|
||||
</video>
|
||||
`;
|
||||
$(this).html(videoEle);
|
||||
|
||||
// $(this).attr("src", `${pathWithoutFileName}/${dtlImgPath}-${idx}.mp4`);
|
||||
});
|
||||
$(".inCarGame .video-slideThumb").each(function(e){
|
||||
const idx = e+1;
|
||||
const src = $(this).find(".themeVideo").attr("src");
|
||||
const lastIndex = src.lastIndexOf("/");
|
||||
const pathWithoutFileName = src.substring(0, lastIndex);
|
||||
const videoEle = `
|
||||
<video loop="" muted="" playsinline="" poster="${pathWithoutFileName}/${dtlImgPath}-1.png">
|
||||
<source src="${pathWithoutFileName}/${dtlImgPath}-1.mp4" type="video/mp4" class="themeVideo">
|
||||
</video>
|
||||
`;
|
||||
$(this).html(videoEle);
|
||||
|
||||
// $(this).attr("src", `${pathWithoutFileName}/${dtlImgPath}-${idx}.mp4`);
|
||||
});
|
||||
$(".inCarGame .themeImgThumb").each(function(e){
|
||||
const idx = e+2;
|
||||
const src = $(this).attr("src");
|
||||
const lastIndex = src.lastIndexOf("/");
|
||||
const pathWithoutFileName = src.substring(0, lastIndex);
|
||||
@@ -589,31 +625,33 @@ $(document).on("click", ".displayTheme .dtthumb", function() {
|
||||
});
|
||||
|
||||
function pdpIntro(){
|
||||
const videoElement = document.getElementById('dpThemeVideo');
|
||||
const videoWrap = $('.displayTheme .video_wrap');
|
||||
const btnIntro = $('.displayTheme .btn-intro');
|
||||
const btnClose = $('.video_wrap .btn-close');
|
||||
if($('#dpThemeVideo').length > 0){
|
||||
const videoElement = document.getElementById('dpThemeVideo');
|
||||
const videoWrap = $('.displayTheme .video_wrap');
|
||||
const btnIntro = $('.displayTheme .btn-intro');
|
||||
const btnClose = $('.video_wrap .btn-close');
|
||||
|
||||
videoElement.addEventListener('ended', function() {
|
||||
$(videoWrap).fadeOut('fast',function(){
|
||||
videoElement.currentTime = 0;
|
||||
videoElement.pause();
|
||||
videoElement.addEventListener('ended', function() {
|
||||
$(videoWrap).fadeOut('fast',function(){
|
||||
videoElement.currentTime = 0;
|
||||
videoElement.pause();
|
||||
});
|
||||
});
|
||||
});
|
||||
$(btnIntro).on('click', function() {
|
||||
$(videoWrap).fadeIn('fast',function(){
|
||||
videoElement.currentTime = 0;
|
||||
videoElement.play();
|
||||
});
|
||||
});
|
||||
|
||||
$(btnClose).on('click', function() {
|
||||
$(videoWrap).fadeOut('fast',function(){
|
||||
videoElement.currentTime = 0;
|
||||
videoElement.pause();
|
||||
$(btnIntro).on('click', function() {
|
||||
$(videoWrap).fadeIn('fast',function(){
|
||||
videoElement.currentTime = 0;
|
||||
videoElement.play();
|
||||
});
|
||||
});
|
||||
|
||||
$(btnClose).on('click', function() {
|
||||
$(videoWrap).fadeOut('fast',function(){
|
||||
videoElement.currentTime = 0;
|
||||
videoElement.pause();
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -267,12 +267,12 @@
|
||||
<li class="swiper-slide">
|
||||
<img class="noBorder" src="../assets/images/kia/contents/incar_game01_1.jpg" alt="사양 구매 후, 게임 카드에 재진입. 홈 화면 > 메뉴 > 게임">
|
||||
<b>STEP 01</b>
|
||||
<p class="caseBlack txtCase01">사양 구매 후, 게임 카드에 재진입 합니다. 홈 화면 > 메뉴 > 게임 <br>(별도의 설치과정이 필요하지 않습니다)</p>
|
||||
<p class="caseBlack txtCase01">사양 구매 후, 게임 카드에 재진입 합니다. <br>홈 화면 > 메뉴 > 게임 <br>(별도의 설치과정이 필요하지 않습니다)</p>
|
||||
</li>
|
||||
<li class="swiper-slide">
|
||||
<img class="noBorder" src="../assets/images/kia/contents/incar_game01_2.jpg" alt="'좌우로 스크롤링하여 게임을 탐색/선택">
|
||||
<b>STEP 02</b>
|
||||
<p class="caseBlack txtCase01">좌우로 스크롤링하여 게임을 탐색/선택합니다. 가장 최근에 실행한 게임이 가장 왼쪽에 나타납니다.</p>
|
||||
<p class="caseBlack txtCase01">좌우로 스크롤링하여 게임을 탐색/선택합니다. <br>가장 최근에 실행한 게임이 가장 왼쪽에 나타납니다.</p>
|
||||
</li>
|
||||
<li class="swiper-slide">
|
||||
<img class="noBorder" src="../assets/images/kia/contents/incar_game01_3.jpg" alt="게임에 대한 설명을 참고한 후 게임을 실행">
|
||||
|
||||
@@ -248,10 +248,10 @@
|
||||
<section>
|
||||
<h2 class="titleCase01">기아 커넥트 스토어 디지털 사양 이용안내</h2>
|
||||
<div class="listType01">
|
||||
<a href="../info/product-usage-guide-lighting" style="background-image: url('../assets/images/kia/contents/imgUsageList05.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>NBA 디스플레이 테마</b></a>
|
||||
<a href="../info/product-usage-guide-lighting" style="background-image: url('../assets/images/kia/contents/imgUsageList06.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>아케이드 게임</b></a>
|
||||
<a href="../info/product-usage-guide-lighting" style="background-image: url('../assets/images/kia/contents/imgUsageList07.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>스마트 회생 시스템 플러스</b></a>
|
||||
<a href="../info/product-usage-guide-lighting" style="background-image: url('../assets/images/kia/contents/imgUsageList08.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>스마트 회생 시스템 플러스</b></a>
|
||||
<a href="../info/product-usage-guide-incargame.html" style="background-image: url('../assets/images/kia/contents/imgUsageList05.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>NBA 디스플레이 테마</b></a>
|
||||
<a href="../info/product-usage-guide-incargame.html" style="background-image: url('../assets/images/kia/contents/imgUsageList06.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>아케이드 게임</b></a>
|
||||
<a href="../info/product-usage-guide-incargame.html" style="background-image: url('../assets/images/kia/contents/imgUsageList07.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>스마트 회생 시스템 플러스</b></a>
|
||||
<a href="../info/product-usage-guide-incargame.html" style="background-image: url('../assets/images/kia/contents/imgUsageList08.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>스트리밍 프리미엄</b></a>
|
||||
|
||||
<a href="../info/product-usage-guide-lighting" style="background-image: url('../assets/images/kia/contents/imgUsageList02.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>라이팅 패턴<br>이용방법</b></a>
|
||||
<a href="../info/product-usage-guide-rspa2" style="background-image: url('../assets/images/kia/contents/imgUsageList01.jpg');" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800"><b>원격 스마트 주차 보조 2(RSPA 2)<br>이용방법</b></a>
|
||||
|
||||
@@ -31,10 +31,10 @@
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/library/jquery-ui.min.js?v1"></script>
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/library/swiper.min.js?v1"></script>
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/library/aos.js?v1"></script>
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/common.js?v1.1"></script>
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/common.js?v55"></script>
|
||||
<!--상품상세 페이지 css 분리-->
|
||||
<link rel="stylesheet" charset="UTF-8" href="../assets/css/product.css?v1.2" type="text/css" />
|
||||
<link rel="stylesheet" charset="UTF-8" href="../assets/css/pdp_detail.css?v1.1" type="text/css" />
|
||||
<link rel="stylesheet" charset="UTF-8" href="../assets/css/pdp_detail.css?v55" type="text/css" />
|
||||
<link rel="shortcut icon" href="../assets/images/kia/home_icon.png" />
|
||||
<link rel="apple-touch-icon-precomposed" href="../assets/images/kia/home_icon.png" />
|
||||
<link rel="shortcut icon" href="../assets/images/kia/favicon-16x16.png">
|
||||
@@ -263,7 +263,7 @@
|
||||
<div class="productImg">
|
||||
<div class="swiper productSwiper">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide"><img src="../assets/images/kia/product-img/producy-temp1.png" alt="이미지 상품명"></div>
|
||||
<div class="swiper-slide"><img src="../assets/images/kia/pdp/display_theme/producy-temp1.png" alt="이미지 상품명"></div>
|
||||
<div class="swiper-slide"><img src="../assets/images/kia/product-img/producy-temp2.png" alt="이미지 상품명"></div>
|
||||
<div class="swiper-slide withVideo">
|
||||
<p class="productSmallVideo">
|
||||
@@ -573,7 +573,7 @@
|
||||
<div class="comp_md layer_up video_wrap">
|
||||
<button type="button" class="btn-close">닫기</button>
|
||||
<video id="dpThemeVideo" playsinline="playsinline" autoplay="autoplay" muted="muted" controls>
|
||||
<source src="https://connectstore.kia.com/kr/ux_data/content/20231214/10f7f9bebf774965907b716d80e510ca.mp4" type="video/mp4">
|
||||
<source src="../assets/images/kia/pdp/display_theme/NBA_Display_Theme_Intro.mp4" type="video/mp4">
|
||||
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
|
||||
</video>
|
||||
</div>
|
||||
@@ -641,6 +641,44 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="comp_wide displayTheme welcome-goodbye">
|
||||
<div class="comp_body">
|
||||
<div class="text_area">
|
||||
<h4 data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
|
||||
Welcome Video
|
||||
</h4>
|
||||
<p data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
|
||||
NBA팀별 로고와 캐릭터가 반영된 Video가 차량 Sleep 모드 동작 이후 차량 시동을 켤 때에 1회 실행됩니다.
|
||||
</p>
|
||||
</div>
|
||||
<div class="image_area" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
|
||||
|
||||
<video playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
|
||||
<source src="../assets/images/kia/pdp/display_theme/lakers_welcome.mp4" type="video/mp4">
|
||||
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comp_body">
|
||||
<div class="text_area">
|
||||
<h4 data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
|
||||
Goodbye Video
|
||||
</h4>
|
||||
<p data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
|
||||
NBA팀별 로고와 컨셉이 반영된 Video가 차량 시동이 꺼질 때 마다 실행됩니다.
|
||||
</p>
|
||||
</div>
|
||||
<div class="image_area" data-aos="fade-up" data-aos-easing="ease-out-expo" data-aos-once="true" data-aos-duration="800">
|
||||
|
||||
<video playsinline="playsinline" autoplay="autoplay" muted="muted" loop>
|
||||
<source src="../assets/images/kia/pdp/display_theme/lakers_goodbye.mp4" type="video/mp4">
|
||||
이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="comp_wide comp_2x_b_h_s_e2 displayTheme">
|
||||
<div class="comp_body">
|
||||
<div class="item">
|
||||
|
||||
@@ -31,10 +31,10 @@
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/library/jquery-ui.min.js?v1"></script>
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/library/swiper.min.js?v1"></script>
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/library/aos.js?v1"></script>
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/common.js?v1.1"></script>
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/common.js?v43"></script>
|
||||
<!--상품상세 페이지 css 분리-->
|
||||
<link rel="stylesheet" charset="UTF-8" href="../assets/css/product.css?v1.2" type="text/css" />
|
||||
<link rel="stylesheet" charset="UTF-8" href="../assets/css/pdp_detail.css?v4" type="text/css" />
|
||||
<link rel="stylesheet" charset="UTF-8" href="../assets/css/pdp_detail.css?v8" type="text/css" />
|
||||
<link rel="shortcut icon" href="../assets/images/kia/home_icon.png" />
|
||||
<link rel="apple-touch-icon-precomposed" href="../assets/images/kia/home_icon.png" />
|
||||
<link rel="shortcut icon" href="../assets/images/kia/favicon-16x16.png">
|
||||
@@ -408,8 +408,12 @@
|
||||
<div class="swiper inCarGameDtl">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide">
|
||||
<div class="image_area">
|
||||
<img src="../assets/images/kia/pdp/in_car_game/theme1-1.png" class="themeImg" alt="디스플레이 테마1">
|
||||
<div class="image_area video-slide">
|
||||
<!-- <img src="../assets/images/kia/pdp/in_car_game/theme1-1.png" class="themeImg" alt="디스플레이 테마1"> -->
|
||||
|
||||
<video loop muted playsinline preload="auto" autoplay poster="/kr/assets/images/kia/pdp/in_car_game/thumb02.png">
|
||||
<source src="../assets/images/kia/pdp/in_car_game/theme2-1.mp4" type="video/mp4" class="themeVideo">
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
<div class="swiper-slide">
|
||||
@@ -430,8 +434,11 @@
|
||||
</div>
|
||||
<div thumbsSlider="" class="swiper inCarGameDtlThumb">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide">
|
||||
<img src="../assets/images/kia/pdp/in_car_game/theme1-1.png" class="themeImgThumb" alt="" />
|
||||
<div class="swiper-slide video-slideThumb">
|
||||
<!-- <img src="../assets/images/kia/pdp/in_car_game/theme1-1.png" class="themeImgThumb" alt="" /> -->
|
||||
<video loop muted playsinline preload="auto" poster="../assets/images/kia/pdp/in_car_game/thumb02.png">
|
||||
<source src="../assets/images/kia/pdp/in_car_game/theme2-1.mp4" type="video/mp4" class="themeVideo">
|
||||
</video>
|
||||
</div>
|
||||
<div class="swiper-slide">
|
||||
<img src="../assets/images/kia/pdp/in_car_game/theme1-2.png" class="themeImgThumb" alt="" />
|
||||
|
||||
@@ -34,7 +34,7 @@
|
||||
<script type="text/javascript" charset="UTF-8" src="../assets/js/common.js?v1.1"></script>
|
||||
<!--상품상세 페이지 css 분리-->
|
||||
<link rel="stylesheet" charset="UTF-8" href="../assets/css/product.css?v1.2" type="text/css" />
|
||||
<link rel="stylesheet" charset="UTF-8" href="../assets/css/pdp_detail.css?v5" type="text/css" />
|
||||
<link rel="stylesheet" charset="UTF-8" href="../assets/css/pdp_detail.css?v6" type="text/css" />
|
||||
<link rel="shortcut icon" href="../assets/images/kia/home_icon.png" />
|
||||
<link rel="apple-touch-icon-precomposed" href="../assets/images/kia/home_icon.png" />
|
||||
<link rel="shortcut icon" href="../assets/images/kia/favicon-16x16.png">
|
||||
|
||||
Reference in New Issue
Block a user