+ 1

How to create touch element to move a character left/right in JavaScript?

I am creating an HTML5 race game with help of CSS & JS. But not sure how to make it fit for all devices, browser size and touch responsive. Any suggestions? You can help me with reference to below game codes I made. Even these doesn't work with touch and resize. https://code.sololearn.com/WhYa2gArx7QH/?ref=app https://code.sololearn.com/WnyefEs3F4JJ/?ref=app

29th Sep 2018, 6:49 AM
Satish Kumar
Satish Kumar - avatar
23 Réponses
+ 1
add button or img onclick or addEventListener click target = getElementById target.translateX / Y = +/-
1st Oct 2018, 4:24 AM
Gordon
Gordon - avatar
+ 1
for fitting the screen use vw instead of px or % (mitali taught me this)
1st Oct 2018, 4:38 AM
Gordon
Gordon - avatar
+ 1
in your html you better div id=playarea div id=theobject so you can var obj = getElementById(theobject); to assign animation to it
1st Oct 2018, 4:39 AM
Gordon
Gordon - avatar
+ 1
Welcome There is a game coding challenge just posted deadline is before 22nd, let's compete together~
1st Oct 2018, 2:35 PM
Gordon
Gordon - avatar
+ 1
Wow, the platform games sound very fun, the kind of very very very addicting RPG game. For the car racing game, i think you will an accelerate / decelerate function so the transform should eat variable instead of constant, when button pressed, acc++ up to a max, put into accelerate() and the transform (translate?) will be faster and faster, for decelerate, it's starts when buttonclick ends and keep calling itself until velocity is zero
1st Oct 2018, 3:14 PM
Gordon
Gordon - avatar
0
thanks
1st Oct 2018, 4:39 AM
Satish Kumar
Satish Kumar - avatar
0
Gordon Chan It worked!! Thank you so much for the help. Now I will be able to complete the game for my nephew. 🙏
1st Oct 2018, 2:33 PM
Satish Kumar
Satish Kumar - avatar
0
Is it on Sololearn?
1st Oct 2018, 2:39 PM
Satish Kumar
Satish Kumar - avatar
1st Oct 2018, 2:47 PM
Gordon
Gordon - avatar
0
Yep I just saw. Is there any way we connect?
1st Oct 2018, 2:48 PM
Satish Kumar
Satish Kumar - avatar
0
connect? you mean follow?
1st Oct 2018, 2:52 PM
Gordon
Gordon - avatar
0
Nope. I mean talk and share the project. Once it's done, we can post it here.
1st Oct 2018, 2:53 PM
Satish Kumar
Satish Kumar - avatar
0
Hmm🤔 we can each write on our own~😆
1st Oct 2018, 2:59 PM
Gordon
Gordon - avatar
0
Gordon Chan Sounds good to me. Lol
1st Oct 2018, 2:59 PM
Satish Kumar
Satish Kumar - avatar
0
I am working on two 2d games though. 1. Car racing game 2. Platform game. but stuck as I am not a Pro coder. Still, gonna try finishing them before 22nd. hope that works.
1st Oct 2018, 3:03 PM
Satish Kumar
Satish Kumar - avatar
0
What's a platform game?
1st Oct 2018, 3:04 PM
Gordon
Gordon - avatar
0
Which stage / which mechanics are you stuck at?
1st Oct 2018, 3:05 PM
Gordon
Gordon - avatar
0
Well in car racing game touch was the only issue. Though the code you provided only give me option to move the car left/right on each tap. though my track canvas is big and it works fine if I use arrow keys for left/right/up& down.
1st Oct 2018, 3:08 PM
Satish Kumar
Satish Kumar - avatar
0
And I only reached 1st half of the platform game. it's a huge one. Trying to make it endless with multiple characters. I have sprite and everything ready. Just need to code. Touch will work as player only jumps.
1st Oct 2018, 3:10 PM
Satish Kumar
Satish Kumar - avatar
0
Yes platform game idea is something like that. But whatever you said about accelerate and all, it all went over my head. Told you, not a Pro.
1st Oct 2018, 3:24 PM
Satish Kumar
Satish Kumar - avatar