Javascript 如何阻止图像移动并根据击键引起动作？

我在自学网络编程。我也在C++上工作。我对Javascript有问题

我需要知道如何根据图像的位置创建“if语句”

我正在做一个简单的游戏，游戏中有一门大炮在来回移动。我希望用户按下一个按钮，使加农炮停止并向目标发射另一个图像

我已经创建了图像和gif图像，这些图像将以弧形从大炮向目标移动

如果用户在加农炮处于正确位置时开火，图像将击中目标

---

有人能告诉我如何根据位置创建if语句吗？或者有人能告诉我如何使大炮停止并显示gif吗？

要在屏幕上获取页面x和y位置的第一张图像，请尝试：

var xpos = document.getElementsByTagName('img')[0].x;

var ypos = document.getElementsByTagName('img')[0].y;

---

要移动加农炮，请向上读取

onkeyup（）

事件-它将等待钥匙释放，然后执行操作

它能做什么？可能会以某种方式改变加农炮的

左侧

位置。我建议在你的大炮上设置CSS样式

position:absolute

，然后用Javascript更改

.left

属性

例如，这里有一些Javascript可以帮助您入门（未经测试）：

它的配套HTML看起来像

...
<img id='cannonPic' src='cannon.jpg' />
...
<script type='text/javascript' src='cannon.js' />

---

要回答“出现/重新出现”子问题，您可以使用通过Javascript访问的

.display

属性：

var cannon = document.getElementById("cannonPic");

function appear() {
    cannon.style.display = '';
}

function hide() {
    cannon.style.display = 'none';
}

---

---

一个小小的警告，在圆弧中移动的东西需要一些数学来将它们转换为二维，这取决于你想要的精确度。如果你喜欢数学，这是一个有趣的练习：）

只需添加一点背景，通常的做法是：

你有一个主循环将“运行”游戏

在循环的每次迭代中，您a）更新游戏中对象（大炮、射弹和目标）的位置，b）将生成的对象渲染到屏幕上

当你检测到一个“开火”按键时，你只需将移动加农炮的“速度”设置为0，使其“停止”

---

你可以使用Steve或sajawikio的方法检索对象的位置，但是你的游戏逻辑决定（并且应该知道）所有对象在任何时候的位置。你的游戏逻辑是“在（x，y）位置画出射弹”。您的游戏逻辑不应该说“我有一个投射物，不确定它到底在哪里，嗯，所以让我们使用Javascript查询它的位置”。至少在这种情况下，你不会有简单、可预测的动作。

你好，加勒特。你能告诉我们你已经做了什么吗？这将有助于展示你的水平，并提供更多关于你正在努力实现的目标的信息。看看这个，这是一门教授JavaScript的课程：

#cannonPic {
    left:0;
    position:absolute;
}

var cannon = document.getElementById("cannonPic");

function appear() {
    cannon.style.display = '';
}

function hide() {
    cannon.style.display = 'none';
}