diff --git a/webapp/src/App.vue b/webapp/src/App.vue
index 673d4708..5aed7071 100644
--- a/webapp/src/App.vue
+++ b/webapp/src/App.vue
@@ -143,6 +143,7 @@ export default {
       ["up", "down", "left", "right"],
       (event) => {
         delete this.arrowKeysDown[event.keyCode]; //Remove key from array
+        this.invokeAction("stage", "jog", { stop: true });
       },
       "keyup",
     );
@@ -158,6 +159,13 @@ export default {
     Mousetrap.bind("pagedown", () => {
       eventBus.emit("globalMoveStepEvent", { x: 0, y: 0, z: -1 });
     });
+    Mousetrap.bind(
+      ["pageup", "pagedown"],
+      () => {
+        this.invokeAction("stage", "jog", { stop: true });
+      },
+      "keyup",
+    );
     this.keyboardManual.push({
       shortcut: "pgup / pgdn",
       description: "Move the microscope focus",
diff --git a/webapp/src/components/tabContentComponents/controlComponents/positionControl.vue b/webapp/src/components/tabContentComponents/controlComponents/positionControl.vue
index 7c14416e..dc56e226 100644
--- a/webapp/src/components/tabContentComponents/controlComponents/positionControl.vue
+++ b/webapp/src/components/tabContentComponents/controlComponents/positionControl.vue
@@ -76,6 +76,7 @@ export default {
     return {
       setPosition: null,
       moveLock: false,
+      jogging: false,
     };
   },
 
@@ -94,6 +95,7 @@ export default {
     eventBus.on("globalMoveInImageCoordinatesEvent", this.onMoveImage);
     // A global signal listener to perform a move in multiples of a step size
     eventBus.on("globalMoveStepEvent", this.onMoveStep);
+
     // Update the current position in text boxes
     await this.updatePosition();
   },
@@ -122,8 +124,7 @@ export default {
       const x = x_steps * navigationStepSize.x * (navigationInvert.x ? -1 : 1);
       const y = y_steps * navigationStepSize.y * (navigationInvert.y ? -1 : 1);
       const z = z_steps * navigationStepSize.z * (navigationInvert.z ? -1 : 1);
-      const movePayload = { x, y, z, absolute: false };
-      eventBus.emit("globalMoveEvent", movePayload);
+      this.invokeAction("stage", "jog", { x: x, y: y, z: z });
     },
 
     async move(payload) {
@@ -131,6 +132,7 @@ export default {
       // Move the stage, by updating the controls and starting a move task
       // This is equivalent to clicking the "move" button.
       if (this.moveLock) return; // Discard move requests if we're already moving
+      if (this.jogging) return; // Discard move requests if a jog is in progress
       // NB moveLock is just  boolean flag - it's not as safe as a "proper" lock.
       this.moveLock = true; // This will also be set by the task submitter, but
       // setting it here avoids multiple moves being requested simultaneously.
diff --git a/webapp/vite.config.mjs b/webapp/vite.config.mjs
index 2f1adf70..bdc2bc35 100644
--- a/webapp/vite.config.mjs
+++ b/webapp/vite.config.mjs
@@ -9,9 +9,7 @@ import vue from "@vitejs/plugin-vue";
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [
-    vue(),
-  ],
+  plugins: [vue()],
 
   build: {
     // Output directory for production builds