Virtual Joystick Usage Example

Download Back To CSSScript.Com

A JavaScript library to create a touch-enabled joystick control that works seamlessly on mobile devices.

Delta X: 0
Delta Y: 0

        import VirtualJoystick from './path-to/Joystick.js';

        const joystickContainer = document.querySelector('.joystick');
        const deltaX = document.querySelector('#delta-x');
        const deltaY = document.querySelector('#delta-y');

        const joystick = new VirtualJoystick(joystickContainer, {
          width: 150,
          height: 150,
          color: 'gray',
          handleColor: 'white',
          handleRadius: 30,
          onChange: function(delta) {
            //your code goes here....
            deltaX.textContent = delta.x.toFixed(2);
            deltaY.textContent = delta.y.toFixed(2);
          },
        });