2013-03-07 113 views
1

我有我的Facebook標籤創建誰包含3個DIV塊,但高度是太大了,我有一個滾動條。 這就是爲什麼我把「溢出:隱藏」 CSS與身體的HTML。 它不工作。 所以,我在網上找到一個好東西:Facebook標籤高度自動調整

<div id="fb-root"></div> 
<script src="http://connect.facebook.net/en_US/all.js"></script> 
<script> 
FB.init({ 
appId : 'MY_APP_ID', 
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"> 
window.fbAsyncInit = function() { 
FB.Canvas.setSize({ height: 1000 }); 
} 
</script> 

,這只是在Firefox和Safari的工作,但在Chrome & IE瀏覽器,我沒有滾動條,但如果我想要去的底部我選項卡我必須左鍵單擊才能滾動並查看該按鈕。 如何我可以調整在Chrome & IE這件事情? 你認爲我的CSS ID不好嗎?

回答

2

檢查了這一點:https://developers.facebook.com/docs/reference/javascript/FB.Canvas.setAutoGrow/並看看其他畫布方法鏈接左側欄的底部。

自從我更新了自己的應用程序重新調整代碼後,這些內容一直在變化,但下面的代碼正好適合放置在頁面的結束標記之前。我無法確切記得,但是您也可能在開始的body標籤中需要style =「overflow:hidden」。

希望這有助於:)

<script type="text/javascript" language="javascript" src="http://connect.facebook.net/en_US/all.js"></script> 
<script type="text/javascript" language="javascript"> 
    FB.init({ 
     appId: '<YOUR_APP_ID>', 
     status: true, // check login status 
     cookie: true, // enable cookies to allow the server to access the session 
     xfbml: true// parse XFBML 
    }); 
    window.fbAsyncInit = function() { 
     FB.Canvas.setSize(); 
    } 

    FB.Canvas.setAutoGrow(7); 
</script> 

還有這個,我發現你:http://petetasker.wordpress.com/2012/10/31/facebook-set-auto-grow-a-version-that-actually-works/

0
<script type="text/javascript" src="https://connect.facebook.net/en_US/all.js"></script> 

<script type="text/javascript"> 
    window.fbAsyncInit = function() { 
     FB.init({ 
     appId  : 'YOUR_APP_ID' 
     }); 
     FB.Canvas.setAutoGrow(); 
    } 
</script> 
0
調用FB JS時

,確保它不是絕對的。根據觀看者的SSL設置,它可能會引發錯誤,並且自動調整大小不起作用。 錯誤:

<script type="text/javascript" src="https://connect.facebook.net/en_US/all.js"></script> 

右:

<script type="text/javascript" src="//connect.facebook.net/en_US/all.js"></script> 
0

所使用setAutoGrow的答案都不對()爲我工作,所以我不得不來計算內容的高度與JavaScript,然後使用的setSize()相應。

window.fbAsyncInit = function() { 

    FB.init({ 
     appId  : 1234567890, 
     xfbml  : true, 
     version : 'v2.3' 
    }); 

    // Find the container that spans your entire content 
    var contentWrapper = document.getElementById("content-wrapper"); 

    // Calculate element height using different methods because some browsers might calculate the height differently, then choose the highest 
    var contentHeight = Math.max(wrapper.scrollHeight, wrapper.offsetHeight, wrapper.clientHeight); 

    // Set canvas size 
    FB.Canvas.setSize({ width: 810, height: contentHeight}); 

};