diff --git a/data/dbconfig.php b/data/dbconfig.php index 623020b..6524251 100644 --- a/data/dbconfig.php +++ b/data/dbconfig.php @@ -1,6 +1,6 @@ { location.href = proLink; }; } + } else if(POPUP_MODE === 5 && imgElement) { + // [모드 2] 점선 연결선 정밀 계산 + const rect = this.getBoundingClientRect(); + const mainRect = mainArea.getBoundingClientRect(); + const targetX = mainRect.left + (mainRect.width * (parseFloat(x1) / 100)); + const targetY = mainRect.top + (mainRect.height * (parseFloat(y1) / 100)); + const isLeft = this.closest('.product-side').classList.contains('left'); + const startX = isLeft ? rect.right : rect.left; + const startY = rect.top + (rect.height / 2); + const dx = targetX - startX; + const dy = targetY - startY; + const dist = Math.sqrt(dx * dx + dy * dy); + let angle = Math.atan2(dy, dx) * 180 / Math.PI; + if (!isLeft) angle += 180; + + this.style.setProperty('--line-width', dist + 'px'); + this.style.setProperty('--line-angle', angle + 'deg'); + this.classList.add('show-connector'); + requestAnimationFrame(() => this.classList.add('active')); + if (imgElement) imgElement.style.transform = 'scale(1.2)'; + + if (imgElement && proLink) { + imgElement.style.cursor = 'pointer'; + imgElement.onclick = () => { location.href = proLink; }; + } + + var popupTimer = setTimeout(() => { + if (imgElement) { + const clone = imgElement.cloneNode(true); + clone.id = 'active-popup-img'; + clone.src = imgSrc; + if (proLink) { + clone.style.cursor = 'pointer'; + clone.style.pointerEvents = 'auto'; + clone.onclick = () => { location.href = proLink; }; + } + mainArea.appendChild(clone); + requestAnimationFrame(() => clone.classList.add('active')); + } + }, 1000); // 1000ms = 1초 대기 + } } });