0

iframeにロードするFacebookキャンバスアプリケーションを作成しています。

コンテンツの高さは、そこにロードされる動的データのために異なる可能性があり、事前に設定することはできません。キャンバスは、コンテンツに合わせて自動的にサイズ変更する必要があります。最近のすべてのブラウザで、iframeの垂直スクロールバーを削除する必要があります。

アプリケーションの詳細設定で「CanvasHeight：Fixed at 800px」を設定し、推奨されるFB.Canvas.setSize（）でソリューションを使用します。

<body>
    <div id="fb-root"></div>
    <script type="text/javascript">
        window.fbAsyncInit = function () {
            FB.init({
                appId: 'NNNN', // My App ID is placed here
                status: true,
                cookie: true,
                xfbml: true
            });
            FB.Canvas.setSize();
            FB.Canvas.setAutoGrow(7);
        };

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

        // Load the SDK Asynchronously
        (function (d) {
            var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
            if (d.getElementById(id)) { return; }
            js = d.createElement('script'); js.id = id; js.async = true;
            js.src = d.location.protocol + "//connect.facebook.net/en_US/all.js";
            ref.parentNode.insertBefore(js, ref);
        } (document));
        ...
    </script>
    ...
</body>

Firefox、MSIE 9、およびOperaで正常に動作します。ただし、WindowsのWebKitブラウザー（SafariおよびChrome）では機能しません。

Safariは、キャンバスiframeに対して次のコードを表示します。

<iframe class="canvas_iframe_util noresize" frameborder="0" scrolling="no" id="iframe_canvas" name="iframe_canvas" src='javascript:""' height="800" style="height: 800px; overflow-y: hidden; "></iframe>

私は何が間違っているのですか？Firefox、MSIE、Opera、Safari、Chromeで同時に動作させることは可能ですか？

4

2 に答える 2

1

一見同じ問題に遭遇しました。これは Webkit 関連の問題だと思います。<html>多くのデバッグの後、ページのタグが に設定されている場合、FB は高さを検出できないという結論に達しましたheight:100%;。これがいくつかの貧しい魂を助けることを願っています.

于 2014-02-13T14:24:41.420 に答える
0

「FB.Canvas.setAutoGrow();」のみを使用します （同じ場所にありますが、パラメーターはありません）iframeのサイズを自動調整すると、正常に機能します。スクロール バーも削除されます。他の場所に問題がある可能性はありますか？

于 2012-05-28T08:24:24.773 に答える