From 8255a1c426ec31d5e3063eae9b47677bb6af2696 Mon Sep 17 00:00:00 2001
From: Zhukj <3262118957>
Date: Fri, 17 Apr 2026 13:59:58 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E5=8F=A0=E5=8A=A0?=
 =?UTF-8?q?=E5=9B=BE=E7=89=87=E9=80=89=E4=B8=AD/=E5=A4=B1=E7=84=A6?=
 =?UTF-8?q?=E4=BA=A4=E4=BA=92?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 css/style.css |  8 ++++++++
 js/script.js  | 25 ++++++++++++-------------
 2 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/css/style.css b/css/style.css
index 7538e8f..2fcdb24 100644
--- a/css/style.css
+++ b/css/style.css
@@ -244,6 +244,14 @@ html, body {
     outline-offset: 2px;
 }
 
+.overlay-layer .overlay-image .resize-handle {
+    display: none;
+}
+
+.overlay-layer .overlay-image.selected .resize-handle {
+    display: block;
+}
+
 .overlay-layer .overlay-image .delete-btn {
     position: absolute;
     top: -10px;
diff --git a/js/script.js b/js/script.js
index 62a7423..15bf2d5 100644
--- a/js/script.js
+++ b/js/script.js
@@ -236,21 +236,20 @@
         let isDragging = false;
         let isResizing = false;
         let startX, startY, startLeft, startTop, startWidth, startHeight;
-        let currentScale = 1;
         const minSize = 30;
 
-        // 点击选中
+        // 点击选中（区分点击和拖拽）
         overlayEl.addEventListener('click', (e) => {
             e.stopPropagation();
             selectOverlay(overlayEl);
         });
 
-        // 拖拽移动
+        // 拖拽移动（不选中也可拖动）
         overlayEl.addEventListener('mousedown', handleDragStart);
         overlayEl.addEventListener('touchstart', handleDragStart, { passive: false });
 
         function handleDragStart(e) {
-            if (e.target.classList.contains('delete-btn')) return;
+            if (e.target.classList.contains('delete-btn') || e.target.classList.contains('resize-handle')) return;
 
             const isTouch = e.type === 'touchstart';
             const clientX = isTouch ? e.touches[0].clientX : e.clientX;
@@ -268,8 +267,6 @@
             document.addEventListener('mouseup', handleDragEnd);
             document.addEventListener('touchmove', handleDragMove, { passive: false });
             document.addEventListener('touchend', handleDragEnd);
-
-            e.preventDefault();
         }
 
         function handleDragMove(e) {
@@ -282,15 +279,17 @@
             const dx = clientX - startX;
             const dy = clientY - startY;
 
-            let newLeft = startLeft + dx;
-            let newTop = startTop + dy;
+            const moveDistance = Math.sqrt(dx * dx + dy * dy);
+            if (moveDistance > 5) {
+                let newLeft = startLeft + dx;
+                let newTop = startTop + dy;
 
-            // 边界限制
-            newLeft = Math.max(-overlayEl.offsetWidth + minSize, Math.min(newLeft, imageContainer.offsetWidth - minSize));
-            newTop = Math.max(-overlayEl.offsetHeight + minSize, Math.min(newTop, imageContainer.offsetHeight - minSize));
+                newLeft = Math.max(-overlayEl.offsetWidth + minSize, Math.min(newLeft, imageContainer.offsetWidth - minSize));
+                newTop = Math.max(-overlayEl.offsetHeight + minSize, Math.min(newTop, imageContainer.offsetHeight - minSize));
 
-            overlayEl.style.left = newLeft + 'px';
-            overlayEl.style.top = newTop + 'px';
+                overlayEl.style.left = newLeft + 'px';
+                overlayEl.style.top = newTop + 'px';
+            }
 
             e.preventDefault();
         }