javascript, 元素 页面 简单碰撞
Posted 洋葱头king
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript, 元素 页面 简单碰撞相关的知识,希望对你有一定的参考价值。
<div>
</div>
<style>
div {
width: 100px;
height: 100px;
background-color: lightblue;
position: fixed;
top: 0;
left: 0;
}
</style>
---------------
<script>
let setDiv = document.querySelector("div");
let divWidth = 100,
divHeight = 100,
divLeft = 0,
divTop = 0;
let vx = 6;
let vy = 6;
let timer = setInterval(() => {
divLeft += vx;
divTop += vy;
setDiv.style.left = divLeft + "px";
setDiv.style.top=divTop+"px";
if (divLeft + divWidth >= innerWidth || divLeft <= 0) {
vx = -vx;
}
if (divTop + divHeight >= innerHeight || divTop <= 0) {
vy = -vy;
}
}, 25)
</script>
以上是关于javascript, 元素 页面 简单碰撞的主要内容,如果未能解决你的问题,请参考以下文章