hola estoy tratando de hacer un juego como los bolos en linea y no consigo que la bola almuerce correctamente en js. cuando hago clic en él, la pelota se va en la dirección equivocada o se sale de la pantalla
var xup var yup var x = 50; var y = 95 document.onmouseup = function(e){ xup = -(e.pageX/screen.width) yup = -(e.pageY/screen.height) let d = setInterval(function(){ x += xup y += yup document.getElementById("player").innerHTML = '<circle id="ball" cx="'+x+'%" cy="'+y+'%" r="1%" fill="url(#ball)" />' if(y<=20){ d=null } },10) } <svg style='position: absolute;left: 0;top: 1%;' width='100%' height='100%'> <defs> <radialGradient id="ball" cx="50%" cy="25%" r="50%" fx="50%" fy="50%"> <stop offset="0%" style="stop-color:#ff00ff;stop-opacity:1" /> <stop offset="100%" style="stop-color:#800080;stop-opacity:1" /> </radialGradient> </defs> <g id="player"> <circle id="ball" cx="50%" cy="95%" r="1%" fill="url(#ball)" /> </g>