Facebook Canvas中的水平禁用滚动条与Firefox

时间:2012-02-06 16:46:45

标签: facebook firefox iframe

我在Facebook App(FF9)中禁用了水平滚动条。

我已经阅读过这里或博客中关于此类问题的所有帖子。到目前为止,我已使用setAutoGrow并在overflow: hiddenbody上应用html

我该如何解决这个问题?

谢谢!

1 个答案:

答案 0 :(得分:0)

问题在于https://connect.facebook.net/en_US/all.js。这个问题多次被报道为一个错误,但从未得到Facebook的证实(见this bug report)。

此代码还会处理all.js错误处理安全连接。

请注意,代码需要http://jquery.com/才能正常工作。

关于滚动条

诀窍是只在DOM完全加载后才异步加载all.js。然后搜索fbAsyncInit回调并继续setAutoGrow

您还提到了固定宽度(520px)和overflow(-x): hidden。不过,这是一个好主意,没有必要。请注意,如果您决定采用这种方式,请在body元素上应用修复宽度,而不是某些内部包装元素。

请参阅以下代码和附注。

$(function(){
    window.fbAsyncInit  = function()
    {
        // fixes the HTTPS issue
        // _https: (window.name.indexOf('_fb_https') > -1),
        // @version /*1328456404,169895806,JIT Construction: v505175,en_US*/
        FB._https           = true;

        // fix for all.js
        // the following line enforces using non-secure URL (why Facebook?)
        // FB.getDomain((c?'https_':'')+'staticfb',true)
        // @version /*1328456404,169895806,JIT Construction: v505175,en_US*/

        FB._domain.api      = 'https://api-read.facebook.com/';
        FB._domain.cdn      = 'https://s-static.ak.fbcdn.net/';
        FB._domain.staticfb = 'https://s-static.ak.facebook.com/';
        FB._domain.www      = 'https://www.facebook.com/';
        FB._domain.m        = 'https://m.facebook.com/';

        FB.init({appId: [app id], channelUrl: '[domain]/channel.php', status: true, cookie: true, oauth: true, xfbml: true});

        FB.Canvas.setAutoGrow(91);
        // it is good idea to ensure that page will always open top-most view when navigated internally
        FB.Canvas.scrollTo(0,0);
    };

    // Load the SDK Asynchronously after the DOM is loaded
    (function(d){
        var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
        js = d.createElement('script'); js.id = id; js.async = true;
        js.src = "https://connect.facebook.net/en_US/all.js";

        d.getElementsByTagName('head')[0].appendChild(js);
    }(document));
});