Question

我创建了一个Facebook应用程序，我配置了以下内容：

IFrame尺寸：可调整大小画布宽度：760px （不使用fbml）

似乎无论我如何配置我的html页面，iframe高度都是800px。我的应用程序需要更多，如何配置facebook应用程序的iframe以获得更大的高度？

谢谢！

Answer 1

将“画布大小”选项设置为“可调整大小”Iframe本身并不会使画布自动调整大小以符合您的内容。你还有其他一些事情需要做。查看Resizable IFrame wiki页面以获取完整说明。

您基本上必须创建一个称为“跨域接收器”的HTML页面（就像复制和粘贴其示例文件一样简单），然后在所有应用程序页面的底部复制一段Javascript代码。一旦内容加载，Javascript将执行iframe的大小调整。

自上次使用维基页面以来，维基页面已有所改进，所以希望它非常简单。如果您在使其正常工作时遇到问题，请确保检查您是否已正确修改了javascript代码段，以便它指向您的跨域接收器页面。

2011年1月更新 - 有些评论进来了，所以我想我会更新。虽然文档已经改变，但我相信这个答案仍然或多或少是正确的。 Facebook已经放弃了FBML，并更新了他们的Javascript SDK。加载Javascript SDK的当前方法位于main Javascript SDK page，底部是可用于调整画布大小{，3}}和FB.Canvas.setAutoResize()的方法。您仍然需要在应用程序的开发人员设置中将画布设置为可调整大小。看起来他们可能已经用新的SDK替换了对跨域文件的需求，但我还没有自己测试过。

Answer 2

我将这段代码放在我的HTML iFrame内容文件的末尾，就在结束标记之前，现在效果很好。

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
  FB.init({
    appId  : 'YOUR_APP_ID',
    status : true, // check login status
    cookie : true, // enable cookies to allow the server to access the session
    oauth  : true // enable OAuth 2.0
  });
  FB.Canvas.setAutoResize();
</script>

显然，把你的APPID放在那里......：）

Answer 3

<强> FB.Canvas.setAutoGrow（）

注意：只有在App Dashboard中Canvas Height设置为“Fixed at（800）px”时才会启用此方法。

启动或停止计时器，该计时器将每隔几毫秒增长一次iframe以适应内容。默认超时为100毫秒。

曾经被称为 FB.Canvas.setAutoResize 。

http://developers.facebook.com/docs/reference/javascript/FB.Canvas.setAutoGrow/

Answer 4

虽然维基不再存在，但我发现了这个页面，我认为这可能是Zombat所说的。

http://apps.facebook.com/wzhu_public_resize/

Answer 5

Facebook最近为画布宽度和高度引入了一种新的“流畅”设置，因此可以使画布尺寸超过正常的760px宽度http://developers.facebook.com/blog/post/538/（2011年8月12日）。

更改设置：

1）转到Facebook应用程序设置页面。

2）选择“高级”。

3）在画布设置下，将画布宽度设置为流体。这允许应用程序几乎占据屏幕的整个宽度。

可以对高度进行相同的操作。

额外：有人猜测这是对Google在游戏领域的努力的回应http://tutorial-on.blogspot.com/2011/08/facebook-features-new-gaming-canvas-and.html

facebook-app：如何更改可调整大小的iframe应用程序的高度？

5 个答案: