選項卡應用程序流體寬度不起作用

Question

我有一個選項卡應用程序在高度和寬度上均設置爲流體。高度是沒有問題的......它是不工作的寬度，所以我的頁面的很大一部分（只有648px寬）沒有顯示出來。我們故意將寬度設置爲小於最大值，這樣我們就不會遇到這個問題。要查看您可以進入箭頭緊固件頁面比賽或像我們一樣輸入標籤。

Answer 1

選項卡應用程序只能使用固定寬度：520px。只有高度是可以設定的。

Fluid Width僅適用於Canvas Apps（apps.facebook.com/app-name），這就是爲什麼這些設置前綴爲「Canvas」（Canvas Width，Canvas Height）的原因。

Mike

Answer 2

在關閉正文標籤上方添加您的AppID和以下代碼。它將在選項卡上完美工作。

<script type="text/javascript"> 
fb_root = document.createElement('div'); 
fb_root.id = 'fb-root'; 
try 
{ 
    window.document.childNodes[0].appendChild(fb_root); 
} 
catch(error) 
{ 
    window.document.body.appendChild(fb_root); 
} 

window.fbAsyncInit = function() { 
    FB.init({ 
    appId : '222222222222222', //your app ID 
    status : true, // check login status 
    cookie : true // enable cookies to allow the server to access the session 
    }); 

    //FB.Canvas.setSize({ width: 520, height: 1400 }); 

    function getDocHeight() { 
     var D = document; 
     return Math.max(
      Math.max(D.body.scrollHeight, D.documentElement.scrollHeight), 
      Math.max(D.body.offsetHeight, D.documentElement.offsetHeight), 
      Math.max(D.body.clientHeight, D.documentElement.clientHeight) 
     ); 
    } 

    var mySetSize = function() { 
     var height = getDocHeight(); 
     FB.Canvas.setSize({ width: 520, height: height }); 
     setTimeout(mySetSize, 200); 
    }; 
    setTimeout(mySetSize, 200); 
}; 

(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); 
}()); 


var head = document.getElementsByTagName('head')[0], 
    style = document.createElement('style'), 
    rules = document.createTextNode('body { position: relative; max-width: 520px!important;width: 520px!important; overflow: hidden!important; margin: 0px!important; }'); 

style.type = 'text/css'; 
if(style.styleSheet) 
    style.styleSheet.cssText = rules.nodeValue; 
else style.appendChild(rules); 
head.appendChild(style); 

</script>