Facebook Tab Height Scroll Bar

Question

I make a simple html page and set it on facebook fan page tab but the tab which shows on fan page is shows a scroll bar buti already set to auto resize and the height of this html page is large i want to hide the scroll bar and show the complete page

Answer 1

The best solution I found, which works for me is:

You need to setup the Facebook app canvas settings, Canvas height to Fluid.

 Then, add some javascript in the page header:

<script type="text/javascript" src="https://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript" charset="utf-8">
    FB.Canvas.setAutoResize();
</script>

Finally, force our body and html tag to avoid scroll bars in css.

body, html {
    overflow:hidden;
}

This has worked for me to remove all the scroll bars. It's working on the 18th of October 2011, but because Facebook keep changing their code, it may change in the future.

A full article about Facebook iframe is available on my blog: http://gpiot.com/facebook-page-tab-hide-scroll-bars-from-iframe/

Answer 2

This solution works for me http://aarosant.com/2011/03/14/adjust-the-size-of-facebook-iframe-tabs/

Answer 3

Thanks to all of you.

Here is the answer of my question; I posted it here so that if any body find this question in future will also get the answer and his/her time is not wasted. I get the solution by adding the following code just before the </body> tag of my index page

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

Once again, thanks to all.

Answer 4

GO TO the App Setting -> Advanced setting -> canvas page there you can change width and height to fixed from fluid