Dynamically Resizing Facebook Canvas (iFrame) Apps to Remove Scrollbars

All new Facebook applications are now iFrame apps. But when you check your app using iFrame inside Facebook, horizontal and vertical scroll bars may appear in the iFrame if the content exceeds height and width of the
canvas. Luckily, Facebook provides a ready to use method to dynamically re-sizing of iFrame inside it.

Step 1

If you want to remove the horizontal and vertical scrollbars from your iFrame Facebook app, GO to your application developer page > app settings and in the “Edit settings” section of your app and change your “IFrame Size” to “Auto-resize” NOT “Show scrollbars.”

Step 2

Open your config file where you have defined other settings for your app and add following code:

Now your iframe FB App should resize automatically depending on the content. You can see the documentation of setAutoResize() method on Facebook wiki.

Hope that helps.

Cheers!