Question

我在head标签之前使用此代码来设置选项卡上画布的大小：

<script type="text/javascript">
window.fbAsyncInit = function() {
FB.Canvas.setSize( {height: 1500} );
}
// Do things that will sometimes call sizeChangeCallback()
function sizeChangeCallback() {
FB.Canvas.setSize( {height: 1500} );
}
</script>

然后在关闭身体标签

之前

<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : '<<app id here>>', 
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
</script>

这很好但很麻烦在不同的浏览器中正确使用它。在这里找到了另外很多代码，如下所示：

<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  : '561492603881225', //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>

现在这在第一个标签https://www.facebook.com/PaycoServices/app_547127248642465上无效地工作但是在另一个https://www.facebook.com/PaycoServices/app_561492603881225上使用它会在底部留下一个白色的间隙，任何想法为什么？

根据内容调整Facebook标签的大小

0 个答案: