It should randomize the location of a black circle when pressed but I can’t figure out why it isn’t working.
function myFunction1(button) {
var xPosition = math.floor(math.random() * 101) + '%';
button.style.top = xPosition;
var yPosition = math.floor(math.random() * 101) + '%';
button.style.left = yPosition;
}
.circle {
width: 100px;
height: 100px;
background-color: red;
border-radius: 50%;
}
.black {
background-color: black;
}
<button type="button" class="black circle" onclick="myFunction1(this)"></button>
Try this:
Change math... to Math..
And add this to css:
.circle {
...
position: fixed;
}
Like this:
function myFunction1(button) {
var xPosition = Math.floor(Math.random() * 101) + '%';
button.style.top = xPosition;
var yPosition = Math.floor(Math.random() * 101) + '%';
button.style.left = yPosition;
}
.circle {
width: 100px;
height: 100px;
background-color: red;
border-radius: 50%;
position: fixed;
}
.black {
background-color: black;
}
<button type="button" class="black circle" onclick="myFunction1(this)"></button>