drupal_100
asked on
Facebook canvas javascript iframe
Facebook application iframe type.
Want to resize the canvas to fit application. Also want to change background color of canvas.
The following works in Firefox. But it does not work in IE and gives JavaScript error.
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></s cript>
<script type="text/javascript"> FB.init("my FB apps API", "xd_receiver.htm"); </script>
<div id="FB_HiddenIFrameContain er" style="display:none; position:absolute; left:-100px; top:-100px; width:0px; height: 0px;"></div>
<div id="FB_HiddenContainer" style="position:absolute; top:-10000px; width:0px; height:0px;" ></div>
<script type="text/javascript">
FB_RequireFeatures(["Canva sUtil"], function(){
FB.XdComm.Server.init('xd_ receiver.h tm');
FB.CanvasClient.startTimer ToSizeToCo ntent();
});
</script>
Want to resize the canvas to fit application. Also want to change background color of canvas.
The following works in Firefox. But it does not work in IE and gives JavaScript error.
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></s
<script type="text/javascript"> FB.init("my FB apps API", "xd_receiver.htm"); </script>
<div id="FB_HiddenIFrameContain
<div id="FB_HiddenContainer" style="position:absolute; top:-10000px; width:0px; height:0px;" ></div>
<script type="text/javascript">
FB_RequireFeatures(["Canva
FB.XdComm.Server.init('xd_
FB.CanvasClient.startTimer
});
</script>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
You'll need to check out this page:
http://wiki.developers.facebook.com/index.php/Cross_Domain_Communication_Channel
about creating a cross-domain communication channel because javascript cannot (natively) communicate to a page on another domain.
They also describe resizing the iframe:
http://wiki.developers.facebook.com/index.php/Resizable_IFrame
and provide an example:
http://apps.facebook.com/wzhu_public_resize/
(view the source to see how they manage it - you want the "Fix height to 1500pt" thing at the bottom)
Open in new window