【问题标题】:Cross-domain iframe cropping/div hiding? Or — alternative?跨域 iframe 裁剪/div 隐藏?或者——替代方案?
【发布时间】:2026-02-23 10:40:01
【问题描述】:

这是我们的问题——我们不知所措。

在 ourdomain.com 上,这是一个 Wordpress 网站,我们需要在 colleaguedomain.com 嵌入部分页面。我们不想显示页眉和页脚(我们只想要正文)。我们的同事不能代表我们编辑他们的任何网站,因此存在跨域同源政策问题 - 但是,我们的同事已明确全权委托我们使用任何可能的解决方法,因此这是一个技术问题而不是道德问题!

这是我们目前正在做的事情:

在 ourdomain.com 上,我们在 div 内有一个 iframe,带有溢出:隐藏。我们使用 -px 在顶部和左侧设置 iframe 的位置:绝对值。这让我们可以隐藏标题。但是我们也在为不显示页脚而苦苦挣扎。有什么办法也可以隐藏页脚吗?

我们不能只使用 iframe 的高度来隐藏页脚,因为我们的 iframe 中我们真正想要显示的页面部分是一个表单;当用户单击原始页面上的下一个按钮时,javascript 会显示表单的下一个字段。这种形式有三个“页面”(记住,都在 iframe 中。)最后一个“页面”比前两个长得多(高度)。因此,如果我们设置高度以容纳前两个“页面”,我们可以隐藏页眉和页脚......但是 iframe 中表单的最后一个“页面”的一部分将被隐藏。如果我们允许,页脚会显示在前两页上。

帮助?我们可以在 iframe 中隐藏页脚的 div 吗?除了 iframe,我们还应该使用其他东西吗?

帮助我们,*!你是我们唯一的希望!

(交叉发布到一些子版块)

【问题讨论】:

  • 我不相信如果不对 iframed 页面进行任何更改就可以做到这一点。您至少需要在该页面中嵌入一些可以与父站点通信的 javascript。

标签: iframe


【解决方案1】:

您将需要 3 页:

  • 容器页面是你想要的内容

  • 剪切/移动页面

  • 包含内容的页面

在您的容器页面上放置一个 iFrame。该 iframe 指向剪辑页面。剪辑页面有一个内容页面的 AJAX 拉取(jQuery 有这些)。然后在您的剪辑页面上,必须在其 x-y 轴上移动 div 并重新调整大小。这将涵盖您不想要的内容。

【讨论】: