我真的需要一些帮助。我正在学习jQuery，我完全陷入了一个我需要生成的功能。我在互联网上无处不在，但找不到我想要实现的现有例子。相反，我有两个单独的例子，我建立并放置在jsfiddle中。我希望有人可以看看每个例子，然后告诉我如何将它们都集成到一件事上。
前提：
我有一个容器div我称之为“canvas”，它将接受一个droppable元素。我的droppable元素是一个带有div的图像。当您将图像拖放到“画布”上时，它将调整大小以适应保持纵横比的div。此示例中的图像最终将是动态的。我不知道图像的宽度，高度或方向。我已经为初始下降完成了重新调整大小的功能。我还允许用户每90度旋转一次掉落的图像。在“示例1”
中删除后，请务必单击该图像问题：
当您将图像放入其容器后单击该图像时，它会像我说的那样旋转，但需要适合“画布”的宽度和高度。因此，当图像处于90度角时，它与“画布”div重叠。我需要以新角度调整图像大小并自动保持其宽高比。图像不能倾斜以适应。在“示例2”中，我几乎实现了重新调整大小的方面。如果加载“示例2”，您将看到在重新调整浏览器大小时图像会重新调整大小。它还保持了它在该过程中的纵横比。我在此示例中添加了一个onClick图像，以便您可以旋转图像，然后在更改浏览器大小时正确调整其大小。
目标：
我需要从“示例1”中删除的图像来执行我的“canvas”div容器中“示例2”中图像正在执行的操作。当浏览器重新调整大小时，不需要执行此操作，我需要在单击图像时进行此操作，以便正确地重新调整每个角度并使其居中。
就像我说我已经尝试了所有的东西，任何可以向我展示这个想法工作的例子都会让我过去7天！
简而言之：
旋转时图像需要符合“画布”尺寸。无论图像处于什么角度，图像都需要保持纵横比。
示例1：
http://jsfiddle.net/jwuliger/wJQmQ/
示例2：
答案 0 :(得分：0)
我不确定我是否完全理解这个问题，特别是因为您的示例2在Chrome中对我不起作用（旋转的图像仍然溢出容器），但这有帮助吗？ http://jsfiddle.net/fEMuW/（减去draggable没有正确重新定位的问题）。