使用javascript调整图像大小并将其保持在原始位置

我花了整整一天的时间试图弄清楚如何调整图像大小和计算比例。我几乎失败了

来描述我的问题，对不起！但我找不到任何字眼。。。这是小提琴：

正如您所看到的，有一张带有沙发和绵羊的图像（如果您没有：请尝试调整浏览器窗口的大小）

现在，继续调整浏览器窗口的大小：你应该看到绵羊和沙发都被调整了大小。我只想让这只该死的羊呆在沙发上，保持一个固定的位置，就像在沙发图像中硬编码一样。不管窗户有多大，羊都必须呆在沙发上

不，我不能用Photoshop把羊贴在上面

在最后一个项目中，我将有一个界面，而不是沙发，绵羊将是一个旋钮或按钮

如果您想亲自尝试，请滚动javascript，直到到达底部，您将看到一条“TODO”注释

有两行代码可以改变sheep的位置：您需要计算的所有其他参数都已经在上面的代码中了（或者至少我希望如此！）。我只是错过了公式

我已经能够动态地调整羊的大小，并与沙发成比例：我怎样才能对它的位置做同样的调整？我试过了！一切！但似乎什么都不管用：'(

提前非常感谢

---

编辑：看起来小提琴链接是错误的。修复了！

不是将

x

和

y

设置为固定值，而是需要相对于图像的新高度和宽度调整它们

x = masterX + (50 * w / imm1.width);
y = masterY + (235 * h / imm1.height);

---

您需要根据图像的新高度和宽度调整它们，而不是将

x

和

y

设置为固定值

x = masterX + (50 * w / imm1.width);
y = masterY + (235 * h / imm1.height);

---

对不起，伙计们！链接错了！我想你是想链接：是的，但是在链接中有一行未使用的代码可能会让人困惑。我已经在原始问题的链接中删除了它：）也许你必须重新加载页面？对不起，伙计们！链接错了！我想你是想链接：是的，但是在链接中有一行未使用的代码可能会让人困惑。我已经在原始问题的链接中删除了它：）也许你必须重新加载页面？先生，你将是我的英雄和救星！谢谢谢谢谢谢谢谢你，伙计！先生，你将是我的英雄和救星！谢谢谢谢谢谢谢谢你，伙计！