I am working on a game and i am using ontouchstart as a way to handle au ser tapping on the screen. but when i click on the screen it does not register the first time, it makes me click it twice for it to register even one click. I have no idea what to do. does anyone know a fix?
I decided to update my code with a more simplified version of it. this is not working either. on an IOS device at least, no matter what browser i use, i have to tap twice for it to register once.
<html>
<link href="https://fonts.googleapis.com/css?family=Press+Start+2P&display=swap" rel="stylesheet" />
<body>
<h1 class="center-align" id="cn">click me</h1>
<h2 id="cl">clicked:</h2>
</body>
<script>
let click = 1;
document.getElementById("cn").ontouchstart = () => {
click++;
document.getElementById("cl").innerHTML = "clicked: " + click;
};
</script>
</html>
Hey can you try removing the
touch-actionfrom the styles? Manipulating touch action ends up affecting touch event listenersEDIT
Can you try this instead?