在 iframe 按钮单击时创建缩放功能（相同域）答案

【问题标题】：Create zoom function on button click for iframe (same domain)在 iframe 按钮单击时创建缩放功能（相同域）
【发布时间】：2018-04-30 17:04:05
【问题描述】：

我有一个 iframe，其 src 链接将与父站点位于同一域中。我想构建一个缩放功能，以便用户可以单击“+”或“-”按钮，并且 iframe 中的内容会缩小或增长，具体取决于按钮单击。

我知道 iframe 很难使用，我正在努力寻找一个我想做的工作示例。我想知道这是否可能。任何示例或快速演示将不胜感激。

【问题讨论】：

请告诉我们您使用 iframe 的原因。我能想到的唯一原因是加载文档和插件。在这种情况下，缩放可能无法按描述工作。
你说得对，我用它来显示一个文档。该文档是一个带有文本映射到其上的图像。我希望有一种方法可以共同放大 iframe 的内容，就像您可以缩放浏览器窗口以增加文本/图像大小一样。
我建议使用 div（固定大小和自动溢出）而不是 iframe 来实现这一点，并使用 css 缩放内容。看看变换：“scale(value)”

【解决方案1】：

你需要做几件事。

首先，假设 +/- 在 iframe 之外，您将需要 iframe 上的 postmessage 和 messagereceive 侦听器，以便父级可以将数据发布到 iframe

然后你需要有一种方法来扩展 iframe 的内容（有很多方法可以做到这一点，从使用 JS 和数学到使用 REM/EM 作为 CSS 中的单位，然后更改基值在 html 上）

【讨论】：