facebook javascript SDK:FB.Canvas.setAutoResize iFrame不能正常工作?

时间:2010-06-11 16:37:01

标签: javascript facebook

我们使用ruby / rails和facebooker(iframe应用程序)构建了一个facebook应用程序,目前仍然使用FB.Canvas.setAutoResize,在某些情况下似乎失败了。使用来自facebook开发人员文档的示例(请参阅http://developers.facebook.com/docs/reference/javascript/)。一旦你进入一个高于800px的页面,autoresize就会失败 - 所以说,只要画布变大,它就会起作用,而不是当它变小时。任何人都有线索或解决方法?

这是调整大小的代码

<div id="fb-root" style="width:1px;height:1px;position:absolute;"></div> 
<script type="text/javascript"> 
  window.fbAsyncInit = function() {
    FB.init({appId: '126342024064822', status: true, cookie: true, xfbml: true});
    FB.Canvas.setAutoResize(true,100);
  };
  (function() {
    var e = document.createElement('script'); e.async = true;
    e.src = document.location.protocol +
      '//connect.facebook.net/en_US/all.js';
    document.getElementById('fb-root').appendChild(e);
  }());
</script>

我非常感谢任何评论或提示,因为我现在已经超过一天了。

3 个答案:

答案 0 :(得分:12)

要确保的一些关键事项在应用程序设置中设置:

  1. 画布设置 - &gt;渲染方法= iFrame
  2. 画布设置 - &gt; iFrame Size = Resizable
  3. 迁移 - &gt;新SDK =已启用
  4. 接下来通过添加超时来调整代码(250似乎效果最好,但您可能想要进行实验)。我在FF3.6和IE7 +中测试了这个。在IE中,有一个垂直滚动条的瞬间闪烁,我仍然试图修复它。

    <div id="fb-root"></div> 
    <script type="text/javascript"> 
      window.fbAsyncInit = function() {
        FB.init({appId: '12345678910', status: true, cookie: true, xfbml: true});
      window.setTimeout(function() {
        FB.Canvas.setAutoResize();
      }, 250);
      };
      (function() {
        var e = document.createElement('script'); e.async = true;
        e.src = document.location.protocol +
          '//connect.facebook.net/en_US/all.js';
        document.getElementById('fb-root').appendChild(e);
      }());
    </script>
    

答案 1 :(得分:7)

解决方案很简单! 除了放FB.Canvas.setAutoResize()
你必须将你的身体改为体型=“溢出:隐藏”

它对我有用!现在ie8还可以!!

答案 2 :(得分:2)

我还想指出,你确实需要你的

<div id="fb-root">

为此工作。