JS实现随机生成球在页面弹动
<div class="dian">
<input type="button" value="点我一下试试!">
</div>
<script>
let clickInput = document.querySelector("input");
let randomTop, randomLeft, vx, vy, moveDiv, timer
clickInput.addEventListener("click", () => {
moveDiv = document.createElement("div");
document.body.appendChild(moveDiv);
randomTop = parseInt(Math.random() * (innerHeight - 99));
randomLeft = parseInt(Math.random() * (innerWidth - 99));
moveDiv.style.top = randomTop + "px";
moveDiv.style.left = randomLeft + "px";
vx = 1;
vy = 1;
timer = setInterval(() => {
randomTop += vx;
randomLeft += vy;
moveDiv.style.top = randomTop + "px";
moveDiv.style.left = randomLeft + "px";
if (randomTop >= (innerHeight - 99) || randomTop <= 0) {
vx = -vx;
}
if (randomLeft >= (innerWidth - 99) || randomLeft <= 0) {
vy = -vy;
}
}
, 1)
})
</script>
</body>
JS实现随机生成球在页面弹动
,温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/32708.html
- 上一篇:应用的当前状态还能保持
- 下一篇: split() 方法用于把一个字符串分割成字符串数组