1 files changed, 9 insertions, 2 deletions

diff --git a/html/cards/script.js b/html/cards/script.js
index 9f11282..5669d3a 100644
--- a/html/cards/script.js
+++ b/html/cards/script.js
@@ -125,8 +125,9 @@ const handleMouseMove = e => {
     if (!gameState.draggingCard) return;
 
     const rect = canvas.getBoundingClientRect();
-    gameState.draggingCard.x = e.clientX - rect.left;
-    gameState.draggingCard.y = e.clientY - rect.top;
+    // Update the card's position using the offset
+    gameState.draggingCard.x = e.clientX - rect.left - dragOffset.x;
+    gameState.draggingCard.y = e.clientY - rect.top - dragOffset.y;
 
     renderAllCards(gameState.cards);
 };
@@ -137,6 +138,8 @@ const handleMouseUp = () => {
     document.removeEventListener('mouseup', handleMouseUp);
 };
 
+let dragOffset = { x: 0, y: 0 }; // To store the offset of the click position
+
 const handleMouseDown = e => {
     const rect = canvas.getBoundingClientRect();
     const x = e.clientX - rect.left;
@@ -156,6 +159,10 @@ const handleMouseDown = e => {
     if (clickedCard) {
         gameState.draggingCard = clickedCard;
 
+        // Calculate the offset between the mouse position and the card's position
+        dragOffset.x = x - clickedCard.x;
+        dragOffset.y = y - clickedCard.y;
+
         // Move the dragged card to the top of the stack
         gameState.cards = gameState.cards.filter(card => card !== clickedCard);
         gameState.cards.push(clickedCard);