diff --git a/assets/controllers/progress_bar_controller.js b/assets/controllers/progress_bar_controller.js
index f332ef1..aef6a30 100644
--- a/assets/controllers/progress_bar_controller.js
+++ b/assets/controllers/progress_bar_controller.js
@@ -5,17 +5,32 @@ export default class extends Controller {
   static targets = ["bar"];
 
   connect() {
-    // Listen for clicks on the entire document instead of just the controller element
-    document.addEventListener("click", this.handleInteraction.bind(this));
-    document.addEventListener("touchend", this.handleInteraction.bind(this));
+    document.addEventListener("click", this.handleInteraction);
+    document.addEventListener("touchstart", this.handleTouchStart);
+    document.addEventListener("touchend", this.handleTouchEnd);
   }
 
   disconnect() {
-    // Clean up event listener when controller disconnects
-    document.removeEventListener("click", this.handleInteraction.bind(this));
-    document.removeEventListener("touchend", this.handleInteraction.bind(this));
+    document.removeEventListener("click", this.handleInteraction);
+    document.removeEventListener("touchstart", this.handleTouchStart);
+    document.removeEventListener("touchend", this.handleTouchEnd);
   }
 
+  handleTouchStart = (event) => {
+    const touch = event.changedTouches[0];
+    this.touchStartX = touch.screenX;
+    this.touchStartY = touch.screenY;
+  };
+
+  handleTouchEnd = (event) => {
+    const touch = event.changedTouches[0];
+    const dx = Math.abs(touch.screenX - this.touchStartX);
+    const dy = Math.abs(touch.screenY - this.touchStartY);
+    if (dx < 10 && dy < 10) {
+      this.handleInteraction(event);
+    }
+  };
+
   handleInteraction(event) {
     const link = event.target.closest("a");
     if (link && !link.hasAttribute("data-no-progress") &&