Answer 1

To move an element to random position
const playercircle = document.querySelector(".playercircle");
playercircle.style.left = Math.random()*250 + "px";
playercircle.style.top = Math.random()*400 + "px";

https://code.sololearn.com/Ws6i7Ua58h4g/?ref=app

Answer 2

body{
width: 300px;
height: 450px;
border: 1px solid black;
position:relative;
}
.playercircle {
height: 50px;
width: 50px;
background-color: blue;
border-radius: 50%;
position: relative;
top: 130px;
left: 150px;
position:absolute;
}

Small change in css

And javascript goes here

window.onload = function(){
function a(){
var x = document.getElementsByClassName("playercircle");
var r1 = Math.floor(Math.random() * 100);
var r2 = Math.floor(Math.random() * 100);
x[0].style.top = String(r1)+"%";
x[0].style.left = String(r2)+"%";
}
setInterval(a,500);
}

Answer 3

Use javascript and use random Math.random() along with set setinterval to simply achive your target

Answer 4

Similar Questions

https://www.sololearn.com/discuss/2291506/?ref=app
https://www.sololearn.com/discuss/1706810/?ref=app