+ 1

HTML script

How do I make this script be able to work using L and R on keyboard instead of onclick and on line 35 there's a description pointing out what do I put in it *s means script it just doesn't let me post if I put it there <html> <head> <title>VS</title> <style> #left, #right{ position:absolute; top:0; bottom:0; cursor:pointer} #left{ right:0; color: #eee;} #right{ right:0; color:#900;} #left div, #right div, #vs{ position:absolute; top:50%; left:50%; margin: -50px 0 0 -50px; width: 100px; height: 100px; text-align: center; font-weight: bold; font-size: 50px; line-height: 100px; border-radius: 50px; } #right, #left div{background-color: #900;} #left, #right div{background-color: #eee;} #vs{background-color: #eee; color:#fff; box-shadow: 2px 2px 5px #000;} </style> </head> <body> <div id="left" onclick="left_click()"><div></div></div> <div id="right" onclick="right_click()"><div></div></div> <div id="vs">VS</div> *s var left = 0, right = 0 var leftDiv = document.getElementById("left"); var rightDiv = document.getElementById("right"); var vsDiv = document.getElementById("vs"); function refresh(){ leftDiv.style.width = (50 + left - right).toString() + "%"; rightDiv.style.width = (50 - left + right).toString() + "%"; leftDiv.firstChild.innerHTML = left; rightDiv.firstChild.innerHTML = right; } function left_click(){ left++; refresh(); } function right_click(){ /* do I put in right++; refresh(); in here? */} *s </body> </html>

1st Nov 2022, 1:37 PM
Allic Manada
Allic Manada - avatar
8 Answers
+ 4
People are more likely to the check your code if you put it in a script on sololearn playground: – Go to Code section, click +, select the programming language, insert your code, save – Come back to this thread, click +, Insert Code, sort for My Code Bits, select your code. Here is how to use key events: https://www.geeksforgeeks.org/how-to-detect-keypress-using-javascript/
1st Nov 2022, 4:44 PM
Lisa
Lisa - avatar
2nd Nov 2022, 10:18 AM
Lisa
Lisa - avatar
+ 3
The + is next to the send button
2nd Nov 2022, 8:59 AM
Lisa
Lisa - avatar
+ 2
I will need to look at it later on my computer, it doesn't display right on my smartphone screen.
2nd Nov 2022, 10:20 AM
Lisa
Lisa - avatar
0
Hi I don't see the + in this thread, did you mean edit? I don't see Input Code either
2nd Nov 2022, 8:58 AM
Allic Manada
Allic Manada - avatar
0
Umm I don't see any send button, only EDIT, POST etc. Sorry I am new to this website
2nd Nov 2022, 9:05 AM
Allic Manada
Allic Manada - avatar
0
Oh and I have put my html code in the code playground you mentioned
2nd Nov 2022, 9:07 AM
Allic Manada
Allic Manada - avatar
0
Yes, sorry I haven't looked at this in a while been busy. Still need a help on it though
9th Nov 2022, 8:50 AM
Allic Manada
Allic Manada - avatar