diff --git a/js/gamepad.js b/js/gamepad.js
index 4134903..33944ae 100644
--- a/js/gamepad.js
+++ b/js/gamepad.js
@@ -926,15 +926,13 @@ class Gamepad {
         gamepad.axes.forEach((updatedAxis, index) => {
             // get the axis information
             const { $axis, attribute, axis } = this.mapping.axes[index];
-            if (!$axis) return;
+            if (!$axis || updatedAxis === axis) return;
 
             // update the display value
-            if (updatedAxis !== axis) {
-                $axis.setAttribute(attribute.replace('-axis', '-value'), updatedAxis);
+            $axis.setAttribute(attribute.replace('-axis', '-value'), updatedAxis);
 
-                // ensure we have an axis updater callback and hook the template defined axis update method
-                if ('function' === typeof this.updateAxis) this.updateAxis($axis, attribute, updatedAxis);
-            }
+            // ensure we have an axis updater callback and hook the template defined axis update method
+            if ('function' === typeof this.updateAxis) this.updateAxis($axis, attribute, updatedAxis);
 
             // save the updated button
             this.mapping.axes[index].axis = updatedAxis;
diff --git a/templates/ds4/template.js b/templates/ds4/template.js
index dc47642..e5849e9 100644
--- a/templates/ds4/template.js
+++ b/templates/ds4/template.js
@@ -28,17 +28,17 @@ window.gamepad.TemplateClass = class DualShock4Template {
         if (!$axis.matches('.stick')) return;
         if (attribute === 'data-axis-x') {
             $axis.style.setProperty('margin-left', `${axis * 25}px`);
-            this.rotateY = parseFloat(axis * 30, 8);
             this.updateRotate($axis);
         }
         if (attribute === 'data-axis-y') {
             $axis.style.setProperty('margin-top', `${axis * 25}px`);
-            this.rotateX = -parseFloat(axis * 30, 8);
             this.updateRotate($axis);
         }
     }
 
     updateRotate($axis) {
-        $axis.style.setProperty('transform', `rotateX(${this.rotateX}deg) rotateY(${this.rotateY}deg)`);
+        const rotateX = parseFloat($axis.getAttribute('data-value-y') * 30);
+        const rotateY = -parseFloat($axis.getAttribute('data-value-x') * 30);
+        $axis.style.setProperty('transform', `rotateX(${rotateX}deg) rotateY(${rotateY}deg)`);
     }
 };
diff --git a/templates/dualsense/template.js b/templates/dualsense/template.js
index 66c146b..d9c84de 100644
--- a/templates/dualsense/template.js
+++ b/templates/dualsense/template.js
@@ -28,17 +28,17 @@ window.gamepad.TemplateClass = class DualSenseTemplate {
         if (!$axis.matches('.stick')) return;
         if (attribute === 'data-axis-x') {
             $axis.style.setProperty('margin-left', `${axis * 25}px`);
-            this.rotateY = parseFloat(axis * 30, 8);
             this.updateRotate($axis);
         }
         if (attribute === 'data-axis-y') {
             $axis.style.setProperty('margin-top', `${axis * 25}px`);
-            this.rotateX = -parseFloat(axis * 30, 8);
             this.updateRotate($axis);
         }
     }
 
     updateRotate($axis) {
-        $axis.style.setProperty('transform', `rotateX(${this.rotateX}deg) rotateY(${this.rotateY}deg)`);
+        const rotateX = parseFloat($axis.getAttribute('data-value-y') * 30);
+        const rotateY = -parseFloat($axis.getAttribute('data-value-x') * 30);
+        $axis.style.setProperty('transform', `rotateX(${rotateX}deg) rotateY(${rotateY}deg)`);
     }
 };
diff --git a/templates/xbox-one/template.js b/templates/xbox-one/template.js
index 52d8807..a7444e7 100644
--- a/templates/xbox-one/template.js
+++ b/templates/xbox-one/template.js
@@ -6,8 +6,6 @@ window.gamepad.TemplateClass = class XboxOneTemplate {
         this.gamepad = window.gamepad;
         this.gamepad.updateButton = this.updateButton.bind(this);
         this.gamepad.updateAxis = this.updateAxis.bind(this);
-        this.rotateX = 0;
-        this.rotateY = 0;
     }
 
     /**
@@ -28,17 +26,17 @@ window.gamepad.TemplateClass = class XboxOneTemplate {
         if (!$axis.matches('.stick')) return;
         if (attribute === 'data-axis-x') {
             $axis.style.setProperty('margin-left', `${axis * 25}px`);
-            this.rotateY = parseFloat(axis * 30, 8);
             this.updateRotate($axis);
         }
         if (attribute === 'data-axis-y') {
             $axis.style.setProperty('margin-top', `${axis * 25}px`);
-            this.rotateX = -parseFloat(axis * 30, 8);
             this.updateRotate($axis);
         }
     }
 
     updateRotate($axis) {
-        $axis.style.setProperty('transform', `rotateX(${this.rotateX}deg) rotateY(${this.rotateY}deg)`);
+        const rotateX = parseFloat($axis.getAttribute('data-value-y') * 30);
+        const rotateY = -parseFloat($axis.getAttribute('data-value-x') * 30);
+        $axis.style.setProperty('transform', `rotateX(${rotateX}deg) rotateY(${rotateY}deg)`);
     }
 };