탭 응용 유체 폭이 작동하지 않습니다.

Question

높이와 너비 모두에서 유체 탭 응용 프로그램을 설정했습니다. 높이는 문제가되지 않습니다 ... 그것은 작동하지 않는 너비이므로 내 페이지의 좋은 부분 (너비가 648px)이 표시되지 않습니다. 우리는 의도적으로 너비를 최대 값보다 작게 설정하여이 문제가 발생하지 않도록했습니다. 보시려면 Arrow Fasteners 페이지 ... contest로 가거나 탭을 입력 해주십시오.

Answer 1

탭 앱은 고정 너비 : 520px로만 작동합니다. 높이 만 설정할 수 있습니다.

유체 폭은 캔버스 응용 프로그램 (apps.facebook.com/app-name)에만 해당하므로이 설정 앞에는 "캔버스"(캔버스 너비, 캔버스 높이)가 붙습니다.

마이크

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>