bobboteck / JoyStick

A simple JoyStick that use HTML5, Canvas and Vanilla JavaScript, for touch and mouse interfaces (no JQuery required), preview at:
https://bobboteck.github.io/joy/joy.html
MIT License
355 stars 96 forks source link

Issues with position: absolute; #11

Closed voltangle closed 4 years ago

voltangle commented 4 years ago

Hi. I use your JoyStick project for controlling my robot over internet, just by opening web page. Issue is: I can't place joy at the bottom of the screen using:

position: relative;
bottom: 0;

because it starts to behave not normal. Without this, controller won't be usable (technically usable, you can click on buttons and move joy, but they will be sitting on top of the screen, which is uncomfortable)

voltangle commented 4 years ago

UPDATE: I realized that when moving this object using position: absolute; JoyStick still thinks that it is in original position, for example: I moved joystick to the bottom of the screen to make it more usable on touch screen, and when I drag it and move cursor to its original position, it behaves like it ment to be(on original position). So I think this is the cause of problem. I will soon update this comment with a video showcase.

bobboteck commented 4 years ago

Hi @GGorAA, I'm happy to declare this issue closed, now you can use FIXED or ABSOLUTE position in the CSS style. See the example of implementation here: https://bobboteck.github.io/joy/joy.html Have fun using the joystick!

voltangle commented 4 years ago

Thanks! Now I can make UI of controller a lot more usable)

voltangle commented 4 years ago

Tested. Nope, doesn't work: https://github.com/bobboteck/JoyStick/issues/12