diff --git a/src/views/arm/MechanicalArm.vue b/src/views/arm/MechanicalArm.vue
index 818bdda..bbba985 100644
--- a/src/views/arm/MechanicalArm.vue
+++ b/src/views/arm/MechanicalArm.vue
@@ -50,14 +50,14 @@
             <label :for="joint.name">{{ joint.name }}</label>
             <el-input v-model="joint.value" readonly>
               <template #prepend>
-                <el-button @mousedown="updateJoint(joint.name, '-')" @mouseup="stop"
-                  @touchstart.prevent="updateJoint(joint.name, '-')" @touchend.prevent="stop">
+                <el-button class="press-control" @pointerdown="startPointerControl($event, () => updateJoint(joint.name, '-'))"
+                  @pointerup="endPointerControl" @pointercancel="endPointerControl">
                   -
                 </el-button>
               </template>
               <template #append>
-                <el-button @mousedown="updateJoint(joint.name, '+')" @mouseup="stop"
-                  @touchstart.prevent="updateJoint(joint.name, '+')" @touchend.prevent="stop">
+                <el-button class="press-control" @pointerdown="startPointerControl($event, () => updateJoint(joint.name, '+'))"
+                  @pointerup="endPointerControl" @pointercancel="endPointerControl">
                   +
                 </el-button>
               </template>
@@ -94,14 +94,14 @@
               <div class="axis-slider-wrap">
                 <div class="axis-name">前后平移</div>
                 <div>
-                  <el-button type="primary" circle @mousedown="move('x', '-', 'end')" @mouseup="stop"
-                    @touchstart.prevent="move('x', '-')" @touchend.prevent="stop">
+                  <el-button class="press-control" type="primary" circle @pointerdown="startPointerControl($event, () => move('x', '-', 'end'))"
+                    @pointerup="endPointerControl" @pointercancel="endPointerControl">
                     <el-icon size="24">
                       <Remove />
                     </el-icon>
                   </el-button>
-                  <el-button type="primary" circle @mousedown="move('x', '+', 'end')" @mouseup="stop"
-                    @touchstart.prevent="move('x', '+')" @touchend.prevent="stop">
+                  <el-button class="press-control" type="primary" circle @pointerdown="startPointerControl($event, () => move('x', '+', 'end'))"
+                    @pointerup="endPointerControl" @pointercancel="endPointerControl">
                     <el-icon size="24">
                       <CirclePlus />
                     </el-icon>
@@ -116,14 +116,14 @@
               <div class="axis-slider-wrap">
                 <div class="axis-name">左右平移</div>
                 <div>
-                  <el-button type="primary" circle @mousedown="move('y', '-', 'end')" @mouseup="stop"
-                    @touchstart.prevent="move('y', '-')" @touchend.prevent="stop">
+                  <el-button class="press-control" type="primary" circle @pointerdown="startPointerControl($event, () => move('y', '-', 'end'))"
+                    @pointerup="endPointerControl" @pointercancel="endPointerControl">
                     <el-icon size="24">
                       <Remove />
                     </el-icon>
                   </el-button>
-                  <el-button type="primary" circle @mousedown="move('y', '+', 'end')" @mouseup="stop"
-                    @touchstart.prevent="move('y', '+')" @touchend.prevent="stop">
+                  <el-button class="press-control" type="primary" circle @pointerdown="startPointerControl($event, () => move('y', '+', 'end'))"
+                    @pointerup="endPointerControl" @pointercancel="endPointerControl">
                     <el-icon size="24">
                       <CirclePlus />
                     </el-icon>
@@ -138,14 +138,14 @@
               <div class="axis-slider-wrap">
                 <div class="axis-name">上下平移</div>
                 <div>
-                  <el-button type="primary" circle @mousedown="move('z', '-', 'end')" @mouseup="stop"
-                    @touchstart.prevent="move('z', '-')" @touchend.prevent="stop">
+                  <el-button class="press-control" type="primary" circle @pointerdown="startPointerControl($event, () => move('z', '-', 'end'))"
+                    @pointerup="endPointerControl" @pointercancel="endPointerControl">
                     <el-icon size="24">
                       <Remove />
                     </el-icon>
                   </el-button>
-                  <el-button type="primary" circle @mousedown="move('z', '+', 'end')" @mouseup="stop"
-                    @touchstart.prevent="move('z', '+')" @touchend.prevent="stop">
+                  <el-button class="press-control" type="primary" circle @pointerdown="startPointerControl($event, () => move('z', '+', 'end'))"
+                    @pointerup="endPointerControl" @pointercancel="endPointerControl">
                     <el-icon size="24">
                       <CirclePlus />
                     </el-icon>
@@ -170,14 +170,14 @@
               <div class="axis-slider-wrap">
                 <div class="axis-name">前后平移</div>
                 <div>
-                  <el-button type="primary" circle @mousedown="move('x', '-', 'posture')" @mouseup="stop"
-                    @touchstart.prevent="move('x', '-')" @touchend.prevent="stop">
+                  <el-button class="press-control" type="primary" circle @pointerdown="startPointerControl($event, () => move('x', '-', 'posture'))"
+                    @pointerup="endPointerControl" @pointercancel="endPointerControl">
                     <el-icon size="24">
                       <Remove />
                     </el-icon>
                   </el-button>
-                  <el-button type="primary" circle @mousedown="move('x', '+', 'posture')" @mouseup="stop"
-                    @touchstart.prevent="move('x', '+')" @touchend.prevent="stop">
+                  <el-button class="press-control" type="primary" circle @pointerdown="startPointerControl($event, () => move('x', '+', 'posture'))"
+                    @pointerup="endPointerControl" @pointercancel="endPointerControl">
                     <el-icon size="24">
                       <CirclePlus />
                     </el-icon>
@@ -192,14 +192,14 @@
               <div class="axis-slider-wrap">
                 <div class="axis-name">左右平移</div>
                 <div>
-                  <el-button type="primary" circle @mousedown="move('y', '-', 'posture')" @mouseup="stop"
-                    @touchstart.prevent="move('y', '-')" @touchend.prevent="stop">
+                  <el-button class="press-control" type="primary" circle @pointerdown="startPointerControl($event, () => move('y', '-', 'posture'))"
+                    @pointerup="endPointerControl" @pointercancel="endPointerControl">
                     <el-icon size="24">
                       <Remove />
                     </el-icon>
                   </el-button>
-                  <el-button type="primary" circle @mousedown="move('y', '+', 'posture')" @mouseup="stop"
-                    @touchstart.prevent="move('y', '+')" @touchend.prevent="stop">
+                  <el-button class="press-control" type="primary" circle @pointerdown="startPointerControl($event, () => move('y', '+', 'posture'))"
+                    @pointerup="endPointerControl" @pointercancel="endPointerControl">
                     <el-icon size="24">
                       <CirclePlus />
                     </el-icon>
@@ -214,14 +214,14 @@
               <div class="axis-slider-wrap">
                 <div class="axis-name">上下平移</div>
                 <div>
-                  <el-button type="primary" circle @mousedown="move('z', '-', 'posture')" @mouseup="stop"
-                    @touchstart.prevent="move('z', '-')" @touchend.prevent="stop">
+                  <el-button class="press-control" type="primary" circle @pointerdown="startPointerControl($event, () => move('z', '-', 'posture'))"
+                    @pointerup="endPointerControl" @pointercancel="endPointerControl">
                     <el-icon size="24">
                       <Remove />
                     </el-icon>
                   </el-button>
-                  <el-button type="primary" circle @mousedown="move('z', '+', 'posture')" @mouseup="stop"
-                    @touchstart.prevent="move('z', '+')" @touchend.prevent="stop">
+                  <el-button class="press-control" type="primary" circle @pointerdown="startPointerControl($event, () => move('z', '+', 'posture'))"
+                    @pointerup="endPointerControl" @pointercancel="endPointerControl">
                     <el-icon size="24">
                       <CirclePlus />
                     </el-icon>
@@ -410,8 +410,37 @@ const stop = async () => {
   })
 }
 
+const activePointerIds = new Set()
+
+const startPointerControl = (event, action) => {
+  if (event.pointerType === 'mouse' && event.button !== 0) return
+
+  event.preventDefault()
+  activePointerIds.add(event.pointerId)
+  event.currentTarget?.setPointerCapture?.(event.pointerId)
+  action()
+}
+
+const endPointerControl = (event) => {
+  event.preventDefault()
+  if (!activePointerIds.has(event.pointerId)) return
+
+  activePointerIds.delete(event.pointerId)
+  if (event.currentTarget?.hasPointerCapture?.(event.pointerId)) {
+    event.currentTarget.releasePointerCapture(event.pointerId)
+  }
+  stop()
+}
+
+const stopActiveControls = () => {
+  if (!activePointerIds.size) return
+  activePointerIds.clear()
+  stop()
+}
+
 const timer = ref(null)
 onMounted(() => {
+  window.addEventListener('blur', stopActiveControls)
   nextTick(() => {
     jointControls.value = urdfViewerRef.value.jointControls
     torqueOn()
@@ -427,6 +456,8 @@ onMounted(() => {
 })
 
 onUnmounted(() => {
+  window.removeEventListener('blur', stopActiveControls)
+  stopActiveControls()
   if (timer.value) {
     clearInterval(timer.value)
   }
@@ -443,6 +474,12 @@ onUnmounted(() => {
   overflow: hidden;
   user-select: none;
 
+  .press-control {
+    touch-action: none;
+    -webkit-user-select: none;
+    user-select: none;
+  }
+
   // 主体三栏布局
   .main-wrap {
     width: 100%;
diff --git a/src/views/chassis/Chassis.vue b/src/views/chassis/Chassis.vue
index 74bbc96..ececd0d 100644
--- a/src/views/chassis/Chassis.vue
+++ b/src/views/chassis/Chassis.vue
@@ -41,15 +41,15 @@
 
           <div class="dpad">
             <button class="dpad__btn dpad__btn--up"
-              @mousedown="onPress('forward')" @mouseup="onRelease" @mouseleave="onRelease"
-              @touchstart.prevent="onPress('forward')" @touchend.prevent="onRelease">
+              @pointerdown="onPointerDown($event, 'forward')"
+              @pointerup="onPointerEnd" @pointercancel="onPointerEnd">
               <svg viewBox="0 0 14 14"><path d="M7 1L13 11H1Z" fill="currentColor" /></svg>
               <small>前进</small>
             </button>
 
             <button class="dpad__btn dpad__btn--lt"
-              @mousedown="onPress('left')" @mouseup="onRelease"
-              @touchstart.prevent="onPress('left')" @touchend.prevent="onRelease">
+              @pointerdown="onPointerDown($event, 'left')"
+              @pointerup="onPointerEnd" @pointercancel="onPointerEnd">
               <svg viewBox="0 0 14 14"><path d="M1 7L11 1V13Z" fill="currentColor" /></svg>
               <small>左转</small>
             </button>
@@ -57,15 +57,15 @@
             <div class="dpad__core"><span /></div>
 
             <button class="dpad__btn dpad__btn--rt"
-              @mousedown="onPress('right')" @mouseup="onRelease"
-              @touchstart.prevent="onPress('right')" @touchend.prevent="onRelease">
+              @pointerdown="onPointerDown($event, 'right')"
+              @pointerup="onPointerEnd" @pointercancel="onPointerEnd">
               <svg viewBox="0 0 14 14"><path d="M13 7L3 1V13Z" fill="currentColor" /></svg>
               <small>右转</small>
             </button>
 
             <button class="dpad__btn dpad__btn--dn"
-              @mousedown="onPress('backward')" @mouseup="onRelease"
-              @touchstart.prevent="onPress('backward')" @touchend.prevent="onRelease">
+              @pointerdown="onPointerDown($event, 'backward')"
+              @pointerup="onPointerEnd" @pointercancel="onPointerEnd">
               <svg viewBox="0 0 14 14"><path d="M7 13L1 3H13Z" fill="currentColor" /></svg>
               <small>后退</small>
             </button>
@@ -200,6 +200,43 @@ function onRelease() {
     })
 }
 
+const activePointerIds = new Set()
+
+const onPointerDown = (event, direction) => {
+    if (event.pointerType === 'mouse' && event.button !== 0) return
+
+    event.preventDefault()
+    activePointerIds.add(event.pointerId)
+    event.currentTarget?.setPointerCapture?.(event.pointerId)
+    onPress(direction)
+}
+
+const onPointerEnd = (event) => {
+    event.preventDefault()
+    if (!activePointerIds.has(event.pointerId)) return
+
+    activePointerIds.delete(event.pointerId)
+    if (event.currentTarget?.hasPointerCapture?.(event.pointerId)) {
+        event.currentTarget.releasePointerCapture(event.pointerId)
+    }
+    onRelease()
+}
+
+const releaseActivePointers = () => {
+    if (!activePointerIds.size) return
+    activePointerIds.clear()
+    onRelease()
+}
+
+onMounted(() => {
+    window.addEventListener('blur', releaseActivePointers)
+})
+
+onBeforeUnmount(() => {
+    window.removeEventListener('blur', releaseActivePointers)
+    releaseActivePointers()
+})
+
 </script>
 
 <style lang="scss" scoped>
@@ -364,6 +401,8 @@ function onRelease() {
                         color: $color-text-primary;
                         cursor: pointer;
                         transition: all .15s ease;
+                        touch-action: none;
+                        -webkit-user-select: none;
 
                         svg {
                             width: 14px;