How to use "FB.Canvas.setAutoResize" with the php SDK?_问答_开发者

How to use "FB.Canvas.setAutoResize" with the php SDK?

开发者 https://www.devze.com 2023-02-07 11:20 出处：网络

I want to make the scrollbars in my iFrame application disapear. So I checked the \"Auto-resize\" radio button under \"Facebook Integration\" and I understand I need to call \"setAutoResize\" so the c

相关专题：facebook php

I want to make the scrollbars in my iFrame application disapear. So I checked the "Auto-resize" radio button under "Facebook Integration" and I understand I need to call "setAutoResize" so the canvas will grow to the height of my page.

But I can't find any documentation about the开发者_如何学运维 php SDK or explanation of how and where shall I call this function (and on what object). I can only find relevent documentation abput the JS SDK which is very different.

FB.Canvas.setAutoResize function will be removed on January 1st, 2012 as announced in this blog post. Please use FB.Canvas.setAutoGrow instead.

You can read more about here.

FB.Canvas.setAutoGrow (Working perfect!)

Note: this method is only enabled when Canvas Height is set to "Settable (Default: 800px)" in the Developer App.

Starts or stops a timer which will grow your iframe to fit the content every few milliseconds. Default timeout is 100ms.

Examples

This function is useful if you know your content will change size, but you don't know when. There will be a slight delay, so if you know when your content changes size, you should call setSize yourself (and save your user's CPU cycles).

window.fbAsyncInit = function() {
  FB.Canvas.setAutoGrow();
}

If you ever need to stop the timer, just pass false.

FB.Canvas.setAutoGrow(false);

If you want the timer to run at a different interval, you can do that too.

FB.Canvas.setAutoGrow(91); // Paul's favourite number

Note: If there is only 1 parameter and it is a number, it is assumed to be the interval.

<script type="text/javascript">
        window.fbAsyncInit = function() {
            FB.init({appId: 'your apikey', status: true, cookie: true, xfbml: true});
            FB_RequireFeatures(["CanvasUtil"], function(){ FB.XdComm.Server.init("xd_receiver.htm");
                FB.CanvasClient.startTimerToSizeToContent(); });
               FB.Canvas.setAutoResize(true,500);
        };
        (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>

You cant do that with PHP SDk (i think) You should use the magic javascript provided by Facebook in order to resize according to the contents :

<div id="FB_HiddenIFrameContainer" style="display:none; position:absolute; left:-100px; top:-100px; width:0px; height: 0px;">
</div> 
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
<script type="text/javascript"> 
    FB_RequireFeatures(["CanvasUtil"], function(){ FB.XdComm.Server.init("xd_receiver.htm"); 
    FB.CanvasClient.startTimerToSizeToContent(); }); 
</script>

http://developers.facebook.com/docs/reference/oldjavascript/FB.CanvasClient.startTimerToSizeToContent

The solution with FB_HiddenIFrameContainer doesn't work for me. Try http://fbforce.blogspot.com/2011/01/how-to-use-fbcanvassetautoresize.html. This works.

 <body style="overflow: hidden">
  <div id="fb-root"></div>
  <script>
    window.fbAsyncInit = function() {
   FB.Canvas.setAutoResize();
    };
    (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>

  <div style="height:2000px; width:500px; background:blue;">
   test page
  </div> 
 </body>