使用JavaScript随机化css的位置

Question

按下它应该随机化一个黑色圆圈的位置，但我不明白为什么它不工作。

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>

Answer 1

试试这个:

改变数学……到长沙. .

添加到css:

.circle {
...
position: fixed;
}

:

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>