基于 iframe 的 Facebook 应用程序在窗口尺寸较小时出现不需要的滚动条

2024-01-24

我有这个 Facebook 应用程序配置文件页面:

http://www.facebook.com/developers/editapp.php?app_id=122313254494566#!/apps/application.php?id=122313254494566 http://www.facebook.com/developers/editapp.php?app_id=122313254494566#!/apps/application.php?id=122313254494566

它与我的基于 iframe 的 Facebook 应用程序 Gem Spinner 相关联:

http://apps.facebook.com/gemspinner/ http://apps.facebook.com/gemspinner/

我看到的是,根据窗口高度,我的 iframe 内容将以固定高度和滚动条显示,而不是像我那样仅沿着页面向下流动(并根据需要从页面底部流动)想。当我缩短窗口时,会出现滚动条;当我使窗口变高时,滚动条消失。我的理解是 Facebook 决定了这个高度并添加了滚动条(但也许我错了)。无论如何,我将不胜感激任何有助于理解这一点并让我的内容在必要时在页面上流动的帮助。


好吧,我做了一些事情来让它发挥作用。

(1) 在我的应用程序设置中,在 Facebook 集成选项卡下的 IFrame 大小下,我选择了自动调整大小而不是显示滚动条。

(2) 我加载了 Facebook connect API(参见下面的代码)。

(3)我在两个不同的地方调用了FB.Canvas.setAutoResize(100)。我调用了两次,因为我不清楚哪个位置会让它更快生效。在早期测试中,我看到 iframe 高度一开始很短(可能是 800 像素高),然后增长到内容的完整大小(可能是 1100 像素高)。在后续测试中,iframe 会立即调整大小,因此我看不到这两种状态。所以我不太清楚这里的时间/机制。

  <body>
    <div id="fb-root">
    </div>
    <script src="http://connect.facebook.net/en_US/all.js" type="text/javascript"></script>
    <script type="text/javascript">
      FB.init({
        appId  : 'your app id here',
        status : true, // check login status
        cookie : true, // enable cookies to allow the server to access the session
        xfbml  : false  // parse XFBML
      });
      FB.Canvas.setAutoResize( 100 );
    </script>

    ... the rest of the page body goes here ...

    <script type="text/javascript">
      FB.Canvas.setAutoResize( 100 );
    </script>
  </body>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

基于 iframe 的 Facebook 应用程序在窗口尺寸较小时出现不需要的滚动条 的相关文章

随机推荐