setAutoGrow: other pages should “shrink” again

Question

I'm using FB.Canvas.setAutoGrow(7); to grow my page (page=highscore table so needs to grow).

However, when I go back to other pages, the canvas stays grown, but it should adapt to the new content, off course... Basicly, it needs to shrink again.

I tried setSize but that didn't work.

Anyone who can help me? I've been looking for hours... Thanks a lot!!!

Answer 1

try this - shrink the canvas when you load a new page and then call setAutoGrow()

FB.Canvas.setSize({height:600});
setTimeout("FB.Canvas.setAutoGrow()",500);

here is a full article describing the solution http://www.twistermc.com/36764/shrink-facebook-tabs/

Answer 2

AFAIK FB.Canvas.setAutoGrow() only grows the iframe. It never shrinks it down. I have been looking for a similar feature for a while but there's no documentation about shrinking the iframe. It would be nice if anyone came up with a function to do a sort of autoShrink().

Answer 3

I had an issue where SetAutoGrow was mis calculating only slightly because of a bottom margin on FB comments at the bottom of the page, resulting in a scrollBar.

Found myself writing my own building upon the above;

var mainContainer = $("#training");

var resizeTimer = setInterval(function () {

  // fix for FF to make setAutoGrow work.
  mainContainer.height('auto');
  var newHeight = mainContainer.height();
  mainContainer.height(newHeight);

  // fixes lack of auto shrink
  FB.Canvas.setSize({ height: newHeight });
}, 500);