2

我想在页面加载时自动调整 Facebook 应用程序高度和页面选项卡高度，但它不起作用。

我确定我做错了一些简单的事情，但我无法识别它。

这是我正在使用的简化代码：（表示++++剪切代码）

<!DOCTYPE ++++ >
<html>
 <head>++++</head>
 <body>
  <div id="container">++++</div>
  <div id="fb-root"></div>
  <script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script> 
  <script type="text/javascript">
   FB.init({appId: '++++', status: true, cookie: true, xfbml: true });
   FB.Canvas.setSize();
  </script>
 </body>
</html>

提前致谢！

更新：

在Settings, Advanced, Canvas Settings,下Canvas Height，我检查了该fixed选项。（据我所见，已经没有Settable选项了，估计已经改名了。）

当我调用该方法时，我的应用程序已完全加载。

通过一点调查，我可以看到应用程序高度和页面选项卡高度开始变成正确的大小，然后几乎立即增加到1200px. （我fixed height的设置为600px.

更新：在 iframe 代码上，它显示以下内容：<iframe src="++ommited++?signed_request=++ommited++" frameborder="0" scrolling="AUTO" style="width:810px; height:1200px;padding:0px; margin:0px" marginheight="0px" marginwidth="0px"></iframe>. 如您所见，它说height:1200px;这似乎是问题所在。

更新：似乎该应用默认为我的应用设置中设置的大小，然后立即调整为1200px. 即使我删除了用于更改应用程序和页面选项卡高度的 Facebook 代码，也会发生这种情况。

有什么建议么？谢谢

4

4 回答 4

2

您必须检查 Canvas 是否已加载FB.Canvas.setDoneLoading()

FB.Canvas.setDoneLoading( function(response) {
    console.log(response.time_delta_ms);
    FB.Canvas.setAutoGrow();
});

FB 文档：https ://developers.facebook.com/docs/reference/javascript/FB.Canvas.setDoneLoading/

于 2012-06-21T07:16:06.493 回答
1

我在 FB 页面中调整我的页面选项卡大小时遇到​​了此类问题。就我而言，我在我的网站页面中进行了以下更改，我希望将其呈现在我的 FB 页面上，作为选项卡：

<html>
<head>
    <script type="text/javascript">
        window.fbAsyncInit = function()
        {
            FB.Canvas.setSize();
        }
    </script>
</head>

<body>
    ......
    ......
    ......
    <div id="fb-root"></div>
    <script type="text/javascript" src="http://connect.facebook.net/de_DE/all.js"></script>
    <script type="text/javascript">
        FB.init({
        appId: 'Your_App_Id', 
        status: true, 
        cookie: true, 
        xfbml: true
        });
        FB.Canvas.setAutoGrow();
    </script>
</body>
</html>

希望它可以帮助你。

于 2012-06-21T06:35:06.247 回答
1 
<style>
#wrap { width: 600px; height: 390px; padding: 0; overflow: hidden; }
#frame { width: 800px; height: 520px; border: 1px solid black; }
#frame {
    zoom: 0.75;
    -moz-transform: scale(0.75);
    -moz-transform-origin: 0 0;
    -o-transform: scale(0.75);
    -o-transform-origin: 0 0;
    -webkit-transform: scale(0.75);
    -webkit-transform-origin: 0 0;
}
</style>
于 2013-11-19T18:15:49.457 回答
0

首先，确保在您的应用设置中将画布高度设置为“可设置（默认：800px）”，否则它不应该工作。

然后，在您调用该方法时，您的应用程序是否已完全加载（关于可能影响页面高度的所有图像、css 等）？

否则，您可能会尝试 FB.Canvas.setAutoGrow - 它会定期检查您的页面高度并调整 iframe 高度。

于 2012-06-16T13:15:59.870 回答