0

我一直试图解决这个问题，但我没有运气。我有一个不断包含滚动条的 Facebook 应用程序（witdh：510）。这是它在 facebook 中的样子： 带有白色滚动条的 Facebook 应用

我的应用程序中没有任何东西的宽度大于 510，所以我很困惑为什么首先会有空白。我也不明白为什么会有一个垂直滚动条，因为页面上显然有足够的空间来容纳应用程序。

在我的应用程序设置中调用了自动调整大小，并且我FB.Canvas.setAutoResize();的window.fbAsyncInit功能中有。我也尝试使用 CSS 重置<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.3.0/build/cssreset/reset-min.css">，但这并没有解决问题。

有什么建议么？

4

3 回答 3

0

如果您确定 iFrame 的尺寸将始终显示内容，那么您可以设置：

<iframe src="yourpage.htm" scrolling="no"></iframe>

scrolling="no"将强制 iFrame 不显示滚动条，即使内容大于框架。

这应该是不显示滚动条的可靠方法，但应该谨慎使用，并且您应该知道，如果内容超出 iFrame 的范围，则内容可能最终会被隐藏，用户没有明显的方式滚动到它。

- 编辑 -

由于您显然无法在 Facebook 上设置它，您应该简单地将您正在加载的页面包装在一个包装器 div 中，并在那里设置高度、宽度和溢出属性。

<div class="wrap" style="height:500px;  width:510px;  overflow:hidden;">
  your page content here
</div>

您可以使用溢出：隐藏；没有滚动条，或者溢出-x：隐藏；仅用于隐藏水平滚动条，或overflow-y:hidden；仅用于隐藏垂直滚动条。

于 2011-04-21T15:53:45.097 回答
0

首先，我会用“firebug”之类的东西检查我的 iframe HTML，检查所有 div 并验证 firebug 左侧的“布局”选项卡。你会看到元素的大小、边框、填充边距等等，检查一切是否正确。

现在发生在我身上的事情是，来自 facebook 的“自动调整大小”在某些浏览器上无法正常工作，因此它计算错误高度，并且右侧仍然有一个滚动条，所以由于这个滚动条，你的内容变得太大，你也会得到一个水平滚动条。

我对此的解决方案是自己指定 iframe 的高度，而不是使用自动调整大小的东西，这是执行此操作的代码（在关闭之前放在页面末尾</body>）：

<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {

    FB.init({appId: '{{fbapp_id}}', status: true, cookie: true,xfbml: true});

    window.setTimeout(function() {
        FB.Canvas.setSize({height:900});
    }, 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>

这里我选择的高度是“900”，但你必须设置自己的高度（你的 iframe 内容的高度 + 一些安全边距，比如 50px 左右）

此外，您必须{{fbapp_id}}用您的真实 Facebook 应用程序 ID 替换。

我希望这有帮助。

于 2011-04-22T08:48:39.490 回答
0

首先，通过 css 从正文中删除填充和边距

body {
 padding:0;
 margin:0;
}

将您的内容放在一个将宽度设置为 520 的 div 中（如果您仍然有滚动条，溢出：隐藏）。在此 DIV 上填充填充和边框（有关详细信息，请参见http://www.w3.org/TR/CSS2/box.html）

当您有很长的内容时，设置此 div 的最小高度也很有帮助。有时你会得到垂直滚动条，这反过来又会导致水平滚动条。

在页面的末尾，就在关闭正文之前设置一个

FB.Canvas.setSize()

还要确保在您的应用程序设置中，您有“自动高度”（或它的名称）而不是滚动条。

于 2011-04-27T20:44:58.787 回答