관리자용 수정

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;
         }
     });
-};
+};
+
+
+// $(document).on("click", ".video_wrap .btn-close", function() {
+//  alert("클릭")
+//      $(".video_wrap").fadeOut('fast',function(){
+//          videoElements.currentTime = 0;
+//          videoElements.pause();
+//      });
+// })