缩放画布以及元素

Question

我想了解如何实现这一点。

这是草图：

描述：我有一个场景（草图上的画布），让我们说两个面板。画布放置在DIV中，位置相对，面板在此DIV之外，并且在此DIV上有一些元素，位置绝对。所有这些元素都是可拖动的。 每个元素都是带有内部画布的div。

问题：我需要以某种方式实现此画布的缩放。我正在缩放画布（在它上面绘制一个网格），元素也在缩放。它可能是缩放（我知道缩放位图后的质量，在我的情况下它是可以接受的）。我不知道如何解决的唯一问题是如何缩放画布和独立元素，我们有一个错觉，即场景正在缩放。希望你能理解我想要做的事情。

Answer 1

如果您的目标浏览器支持CSS3变换，您可以将变换应用于浮动div以匹配画布中的变换，例如将样式设置为transform: scale(1.5,1.5)。

注意：您可能希望包裹画布的div和绝对div具有overflow: hidden，以便您只显示该区域中的内容。