Question

我在Facebook上有多个应用，但我遇到了一个应用的问题。它渲染的宽度超过了520px，导致滚动条出现，即使我的所有内容都适合屏幕（滚动时只有空白区域）。我已经仔细检查了我的CSS样式和设置，它看起来与另一个正确呈现的应用程序相同。有什么建议？

以下是给我提问的应用程序的链接。

https://www.facebook.com/slp.cc#!/slp.cc?sk=app_195351823894125

如果你看一下2012年的雪花秀时间表，就会有所了解。

Answer 1

我有类似的问题，改变了身体的CSS！只需尝试执行以下操作并更改您需要的数字：

位置：相对; 顶部：-5px; 左：-5px，宽度：520px，

Answer 2

您可以尝试使用 FB.Canvas.setAutoResize（）。它将摆脱水平和垂直滚动条。

请参阅以下代码段：

<body onload="sizeChangeCallback()">

<div id="fb-root">
    </div>

    <script>
        window.fbAsyncInit = function() {
            FB.init({
                appId: 'YOUR APP ID',
                status: true, // check login status
                cookie: true, // enable cookies to allow the server to access the session
                xfbml: true, // parse XFBML
                oauth: true
            });
            FB.Canvas.setAutoResize(); //set size according to iframe content size           
        };       

        (function() {
            var e = document.createElement('script');
            e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
            e.async = true;
            document.getElementById('fb-root').appendChild(e);
        } ());

        function sizeChangeCallback() {
            FB.Canvas.setAutoResize();
        }

    </script>

如果滚动条仍然存在，则将主体的溢出样式设置为隐藏。

EX：<body style="overflow: hidden; onload="sizeChangeCallback()"></body>

FB App ..滚动条显示页面小于520px宽

2 个答案: