如何解决根据鼠标位置旋转div
我正在开发一个JavaScript游戏,其中您根据鼠标所在的位置来开车(因此它会朝着鼠标移动)。
但是现在它只是一个跟随鼠标的矩形。我希望它旋转以扭曲鼠标(例如,如果您有一个宽度为100px,高度为50px的矩形,并且左侧为白色,右侧为黑色,则黑色侧应始终面向光标)。
我尝试为鼠标的某些位置制作if语句,但是经过一个小时的编程,我发现这将需要数周的时间。有人知道更好和/或更容易的方法吗?
解决方法
您可以使用transform: rotate(angle)
。然后使用atan2
const mousePos = { x: 10,y: 10 }
const carPos = { x: 30,y: 20 }
const vector = { x: mousePos.x - carPos.x,y: mousePos.y - carPos.y }
const angle = Math.atan2(vector.y,vector.x) * 180 / Math.PI;
也许您需要添加90度或类似的角度。未经测试。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。