USP영상 추가

assets/css/pdp_detail.css

@@ -2992,6 +2992,7 @@
   left: 50%;
   transform: translate(-50%, -50%);
   width: 100%;
+  background: #000;
   aspect-ratio: 16/9;
 }
 .editorWarp .video_wrap .video-area .video video {
@@ -3000,6 +3001,10 @@
   height: 100%;
   visibility: visible;
 }
+.editorWarp .video_wrap .video-area .video video video[poster] {
+  height: 100%;
+  width: 100%;
+}
 .editorWarp .video_wrap .video-area .video .btn-play {
   display: none;
   position: absolute;
@@ -3010,6 +3015,7 @@
   height: 8rem;
   background: url(../images/kia/contents/ico_play.png) no-repeat center/100% auto;
   text-indent: -9999em;
+  cursor: pointer;
 }
 .editorWarp .video_wrap .video-area .video .btn-play.pause {
   display: none;
@@ -3181,8 +3187,10 @@
 }
 .editorWarp.playing .comp_body.layer_up,
 .editorWarp.playing .thumb-swiper,
+.editorWarp.playing .pdpInCarGameSwiper,
 .editorWarp.playing .displayThemeDtl,
-.editorWarp.playing .inCarGameDtl {
+.editorWarp.playing .inCarGameDtl,
+.editorWarp.playing .srsPlus .visualBg {
   filter: blur(2px);
 }
 .editorWarp.playing .displayThemeDtl,

assets/css/pdp_detail.scss

@@ -3404,6 +3404,7 @@
                 left: 50%;
                 transform: translate(-50%, -50%);
                 width: 100%;
+                background: #000;
                 aspect-ratio: 16/9;
 
                 video {
@@ -3411,6 +3412,10 @@
                     width: 100%;
                     height: 100%;
                     visibility: visible;
+                    video[poster]{ 
+                        height:100%;
+                        width:100%;
+                    }
                 }
 
                 .btn-play {
@@ -3423,6 +3428,7 @@
                     height: 8rem;
                     background: url(../images/kia/contents/ico_play.png) no-repeat center / 100% auto;
                     text-indent: -9999em;
+                    cursor: pointer;
 
                     &.pause {
                         display: none;
@@ -3634,8 +3640,10 @@
 
         .comp_body.layer_up,
         .thumb-swiper,
+        .pdpInCarGameSwiper,
         .displayThemeDtl,
-        .inCarGameDtl {
+        .inCarGameDtl,
+        .srsPlus .visualBg {
             filter: blur(2px);
         }
 

assets/js/common.js

@@ -702,12 +702,15 @@ function pdpIntro() {
     switch (true) {
       case $(".displayTheme").length > 0:
         cookieVal = "displayThemeIntro";
+        $(".video_wrap video").attr("poster","../assets/images/kia/pdp/display_theme/intro_poster.png")
         break;
       case $(".inCarGame").length > 0:
         cookieVal = "inCarGameIntro";
+        $(".video_wrap video").attr("poster","../assets/images/kia/pdp/in_car_game/intro_poster.png")
         break;
       case $(".srsPlus").length > 0:
         cookieVal = "srsPlusIntro";
+        $(".video_wrap video").attr("poster","../assets/images/kia/pdp/srs_plus/intro_poster.png")
         break;
     }
 

product/pdp_display_theme_0429.html

@@ -31,7 +31,7 @@
         <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?v55"></script>
+        <script type="text/javascript"  charset="UTF-8"  src="../assets/js/common.js?v1145"></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?v55" type="text/css" />
@@ -448,9 +448,9 @@
     <div class="comp_bottom thumb-swiper">
         
 
-        <button type="button" class="btn-intro">
+        <div class="btn-intro">
             Intro영상 다시보기
-        </button>
+        </div>
         <div class="com_bottm_inner">
             <div class="swiper pdpDisplayThemeSwiper">
                 <div class="swiper-wrapper">
@@ -588,7 +588,7 @@
         <div class="video-area">
             <div class="video">
                
-                <video playsinline="playsinline" controls>
+                <video playsinline="playsinline" >
                     <source src="../assets/images/kia/pdp/display_theme/NBA_Display_Theme_Intro.mp4" type="video/mp4">
                     이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
                 </video>
@@ -964,7 +964,7 @@
             </div>
          </div>
          
-         <div class="popupWarp"  style="display:none;">
+         <div class="popupWarp" style="display:none;">
             <div class="popInner termsPop" style="display:none;">
                <div class="popContents">
                   <h1>개인정보 수집/이용 및 기타 동의</h1>

product/pdp_in_car_game.html

@@ -407,7 +407,7 @@
         <div class="video-area">
             <div class="video">
                
-                <video playsinline="playsinline" controls>
+                <video playsinline="playsinline">
                     <source src="../assets/images/kia/pdp/in_car_game/intro.mp4" type="video/mp4">
                     이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
                 </video>

product/pdp_srs_plus.html

@@ -350,8 +350,8 @@
         <div class="video-area">
             <div class="video">
                
-                <video playsinline="playsinline" controls>
-                    <source src="../assets/images/kia/pdp/display_theme/NBA_Display_Theme_Intro.mp4" type="video/mp4">
+                <video playsinline="playsinline">
+                    <source src="../assets/images/kia/pdp/srs_plus/intro2.mp4" type="video/mp4">
                     이 문장은 여러분의 브라우저가 video 태그를 지원하지 않을 때 화면에 표시됩니다!
                 </video>
                 <div class="btn-close">닫기</div>