facebook javascript SDK: FB.Canvas.setAutoResize iFrame ne fonctionne pas?

Question

nous avons construit une application facebook avec ruby ​​/ rails et facebooker (application iframe) et sommes actuellement bloqués avec le FB.Canvas.setAutoResize qui semble échouer dans certains cas. en utilisant l'exemple de docs développeur facebook (voir http://developers.facebook.com/docs/reference/javascript/). l'autoresize échoue une fois que vous entrez une page qui est supérieure à 800px - pour ainsi dire, cela fonctionne aussi longtemps que la toile devient plus grande, pas quand elle devient plus petite. Quelqu'un a une idée ou peut-être une solution de contournement?

ici est le code de redimensionnement pièce

<div id="fb-root" style="width:1px;height:1px;position:absolute;"></div> 
<script type="text/javascript"> 
    window.fbAsyncInit = function() { 
    FB.init({appId: '126342024064822', status: true, cookie: true, xfbml: true}); 
    FB.Canvas.setAutoResize(true,100); 
    }; 
    (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); 
    }()); 
</script> 

je suis très reconnaissant pour des commentaires ou des conseils, depuis que je suis tordant ma tête autour de celui-ci pendant plus d'un jour maintenant.

Answer 1

Quelques éléments clés pour vous assurer que sont définies dans les paramètres de l'application:

1. toile Paramètres -> Rendu méthode = iFrame
   
2. toile Paramètres -> iFrame Taille = redimensionnables
   
3. Migrations -> new SDK = Enabled

Ensuite, ajustez votre code en ajoutant un délai (250 semble fonctionner mieux, mais vous pouvez essayer r). J'ai testé cela dans FF3.6 et IE7 +. Dans IE il y a un flash momentané de la barre de défilement verticale que j'essaie toujours de réparer.

<div id="fb-root"></div> 
<script type="text/javascript"> 
    window.fbAsyncInit = function() { 
    FB.init({appId: '12345678910', status: true, cookie: true, xfbml: true}); 
    window.setTimeout(function() { 
    FB.Canvas.setAutoResize(); 
    }, 250); 
    }; 
    (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); 
    }()); 
</script> 

Answer 2

la solution est facile! en plus de mettre FB.Canvas.setAutoResize()
vous devez changer ur corps à corps style = "overflow: hidden"

il fonctionne pour moi! maintenant ie8 est ok !!

Answer 3

Je voudrais aussi souligner, que vous avez besoin en effet votre

<div id="fb-root"> 

pour que cela fonctionne.