diff --git a/assets/js/common.js b/assets/js/common.js index 6aa99fe..e3a4be6 100644 --- a/assets/js/common.js +++ b/assets/js/common.js @@ -262,11 +262,12 @@ $(document).ready(function() { //디스플레이테마 스크롤 시 스와이퍼 실행 if ( $( this ).scrollTop() > 400 ) { if(flagScroll){ + // console.log("스크롤 실행") + pdpIntro(); pdpDisplayThemeSwiper() pdpDisplayThemeSwiperDtl(); pdpInCarGameSwiper() pdpInCarGameSwiperDtl(); - pdpIntro(); flagScroll = false; } @@ -624,33 +625,63 @@ $(document).on("click", ".displayTheme .dtthumb", function() { dtthumbClickFlag = true; }); -function pdpIntro(){ - 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'); +function pdpIntro() { + // dpThemeVideo 요소가 존재하는지 확인 + if ($('.video_wrap video').length > 0) { + // .video_wrap 내 모든 비디오 요소 선택 + const videoElements = document.querySelectorAll('.video_wrap video'); + videoElements.forEach(video => { + + const videoWrap = $('.displayTheme .video_wrap'); + const btnIntro = $('.displayTheme .btn-intro'); + const btnClose = $('.video_wrap .btn-close'); + // console.log("Intro 실행"); - videoElement.addEventListener('ended', function() { - $(videoWrap).fadeOut('fast',function(){ - videoElement.currentTime = 0; - videoElement.pause(); + // 비디오 요소가 존재하는지 확인 + if (video) { + // 비디오 재생이 끝났을 때 이벤트 리스너 추가 + video.addEventListener('ended', function() { + // console.log("addEventListener ended 실행"); + $(videoWrap).hide(); + // 비디오 재생이 끝나면 비디오 숨기기 + // $(videoWrap).fadeOut('fast',function(){ + // console.log("fadeOut 실행") + // video.currentTime = 0; + // video.pause(); + // }); + }); + } + + // .btn-intro 버튼 클릭 시 비디오 재생 + $(document).on("click", ".displayTheme .btn-intro", function() { + // console.log('intro 다시 실행'); + $(videoWrap).show(); + if (video) { + video.currentTime = 0; + video.play(); + } }); - }); - $(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(); + + // .btn-close 버튼 클릭 시 비디오 숨기기 + $(document).on("click", ".video_wrap .btn-close", function() { + // console.log('btn close 실행'); + $(videoWrap).hide(); + if (video) { + video.currentTime = 0; + video.pause(); + } }); }); + + // 주석 처리된 부분: 버튼 클릭 시 비디오 숨기기 + // $(btnClose).on('click', function() { + // $(videoWrap).show() + // // .fadeOut('fast',function(){ + // // video.currentTime = 0; + // // video.pause(); + // // }); + // }); } } @@ -858,4 +889,13 @@ $.fn.clearForm = function () { this.selectedIndex = -1; } }); -}; \ No newline at end of file +}; + + +// $(document).on("click", ".video_wrap .btn-close", function() { +// alert("클릭") +// $(".video_wrap").fadeOut('fast',function(){ +// videoElements.currentTime = 0; +// videoElements.pause(); +// }); +// }) diff --git a/product/pdp_display_theme_0429.html b/product/pdp_display_theme_0429.html index 4f2a8c9..f78f67c 100644 --- a/product/pdp_display_theme_0429.html +++ b/product/pdp_display_theme_0429.html @@ -241,8 +241,8 @@
- Kia Dynamic LED - Light Type-A + NBA 디스플레이 테마 +
특별하고 빛나는 것을 좋아 하시나요? 일상에 기쁨을 더해주는 빛의 변주, 딜라이팅 라이팅이 당신을 기다립니다.
+ +30개 NBA 팀의 개성있는 디스플레이 테마로 분위기 업업~!!!
- 해당 사양은 디지털 패턴 라이팅 그릴이 적용된 차량에 한해서 구매할 수 있습니다. 참고하시길 바랍니다. + 기아 ccNC 인포테인먼트 플폼이 적용된 차량에만 선택 가능합니다.
- 고객 취향과 선호도에 따라 앱 또는 차량 내에서 패턴 설정을 커스터마이징할 수 있습니다. + 여러 개의 테마를 구입하여 운전자 별로 다르게 설정할 수 있습니다.
+ NBA 디스플레이 테마 + + +
30개 NBA 팀의 개성있는 디스플레이 테마로 분위기 업업~!!!
+- Kia Dynamic LED - Light Type-A + 아케이드 게임 +
차안에서 게임을 즐기며 시간을 보내보세요.
- 해당 사양은 디지털 패턴 라이팅 그릴이 적용된 차량에 한해서 구매할 수 있습니다. 참고하시길 바랍니다. + 기아 커넥트 서비스 가입 상태인 고객에 한하여 가입 및 플레이 가능하오니 구매에 참고 바랍니다.
- 고객 취향과 선호도에 따라 앱 또는 차량 내에서 패턴 설정을 커스터마이징할 수 있습니다. + 해당 아이템은 12.5인치 CCNC 플랫폼 적용 차량에 한하여 구입 가능합니다.
- 기아 커넥트 서비스 가입 상태인 고객에 한하여 가입 및 플레이 가능하오니 구매에 참고 바랍니다. + 기아 커넥트 서비스 이용자에 한하여 구매할 수 있습니다.
- 해당 아이템은 12.5인치 CCNC 플랫폼 적용 차량에 한하여 구입 가능합니다. + 상품 구매 및 이용가능 여부는 차량 하드웨어 구성 및 제어기의 펌웨어 버전에 따라 상이할 수 있으며, 로그인 후 확인하실 수 있습니다.