Chrome 中的 Facebook iframe 应用程序滚动条答案

【问题标题】：Facebook iframe app scroolbars in ChromeChrome 中的 Facebook iframe 应用程序滚动条
【发布时间】：2012-02-03 12:48:52
【问题描述】：

这肯定已经讨论过无数次了，但我找不到可行的解决方案。

如何在 Chrome 中摆脱 Facebook iframe 应用程序中的滚动条。 IE 和 Firefox 都可以。

使用建议的 CSS 溢出：隐藏，如果内容高度超过 800 像素，则简单地切断内容。

即使是 Facebook Coca Cola iframe 应用程序的内容也被截断了！！看这里 http://www.facebook.com/cocacola?sk=app_161193133389

这也是我在 Chrome (v. 16.0.912.77 m) 中的应用所发生的情况

【问题讨论】：

你在说哪个 iframe？ TAB 还是画布？
标签 ifram 应用程序，查看可口可乐页面并单击“主页”“标签/链接”，您将在 Chrome 中看到内容被截断（超过 800 像素高度）
Chrome v16 已经过时了...我使用的是 v19，但没有滚动条
这里没有与滚动条相关的问题（Chrome 20-beta）。不过，您可能想在 https 中检查它（页面上的内容不安全）。 Fyi Chrome 16 已经老了，正常人至少 18 或 19 岁。重新启动浏览器可能会有所帮助：p

【解决方案1】：

将此添加到您的画布应用的 fb js：

FB.Canvas.setSize({ width: 520, height: X });

X 是你想要的高度。

如果您的应用流畅使用：

FB.Canvas.setAutoGrow();

【讨论】：

对不起，我的应用页面有一个动态高度，上面的代码是我已经使用的，它在 FF 和 IE 中运行良好，但在 Chrome 中不行。
尚未设置我 99% 确定你不是 ;)
是的，我是...ttp://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" rel="nofollow" target="_blank">w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

【解决方案2】：

我有一个类似的问题：添加 FB JS SDK 和

FB.Canvas.setAutoGrow();

我必须设置

身体{}

在 css 中防止滚动条在 chrome 中显示。在我的情况下是填充。

body{
    overflow: hidden;
    margin: 0px;
    padding: 0px;
}

【讨论】：

【解决方案3】：

我也会尝试延迟设置大小并尝试一下：

window.setTimeout("FB.Canvas.setSize({ width: 520, height: 1111 })", 2000);

别忘了在调用FB.Canvas.setSize 或FB.Canvas.setAutoGrow之前使用您的应用ID (FB.init) 初始化Facebook。

【讨论】：

【解决方案4】：

您必须对您的应用程序进行一些调整。首先，将以下代码添加到您的页面：

FB.Canvas.setAutoGrow(); 告诉 Facebook SDK 在内容较长时调整 iframe 的大小。

将overflow: hidden 添加到<html> 或<body> CSS

检查您的应用设置并确保您已将画布宽度设置为“流动”，将画布高度设置为“固定”（转到设置 > 高级 > 滚动到画布设置。）

所有这些都应该修复滚动条。如果没有，请在 Chrome 中使用“检查元素”之类的东西来查看是否有什么东西导致了条形图的出现。

【讨论】：

【解决方案5】：

您可以在下面尝试各种解决方案。请评论哪一个，或者如果它们都不起作用，我会相应地更新这个答案。

如果您还没有，请尝试添加：body{overflow:hidden;}
您可能还禁用了 javascript。
或者，您可以在应用设置中将应用的固定高度设置得非常高，其中显示：fixed[ ]。还要确保在您的应用设置中选择了固定。
如果这发生在其他应用程序上，包括你提到的可口可乐页面，那么它可能是浏览器。尝试更新。我使用的是 Chrome 19.0.1084.56，没有任何问题，（除了我，高度总是被推到 1200px 最大高度）。
也请看这里：'Choosing between Facebook iframe scrollbar or page cut off halfway'，那里有您可以尝试的解决方案。
编辑：也请看这里：'Timeline page app height stuck at 800px'。

编辑： 在浏览了 Facebook 错误区域后，Facebook 说这不是 Facebook 端的错误，因此一定是您的代码有问题。（来源：'https://developers.facebook.com/bugs/360687100649759'）

如果这不起作用，请发表评论并说出来，我会做进一步的研究。

【讨论】：