2011-10-24 6 views
2

私はページ内のタブとして使用するアプリケーションを構築しました。
内容が長すぎるため、スクロールバーがないようにiframeの高さを設定する必要があります。
私の問題は、それがクローム&で正常に動作することです。つまり、Firefoxでは動作しません。ここで
は私が何をやったかである:さらにFacebookタブのアプリケーションキャンバスの高さ - Firefoxの問題

<?php 
    $signed_request = $_REQUEST["signed_request"]; 
    list($encoded_sig, $payload) = explode('.', $signed_request, 2); 
    $data = json_decode(base64_decode(strtr($payload, '-_', '+/')), true); 
?> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 

    <style type="text/css"> 
     * { 
      padding:0; margin:0; border: none; outline:none 
     } 
    </style> 

</head> 
<body style="width:520px; overflow:hidden"> 
<?php 
    if (empty($data["page"]["liked"])) { 
     echo "<img src=\"img/blur.jpg\" />"; 
    } 
    else { 
     echo "<img src=\"img/fan.jpg\" />"; 
    } 
?> 
<div id="fb-root"></div> 
<script src="http://connect.facebook.net/en_US/all.js"></script> 
<script> 
    FB.init({ 
    appId : 'xxx_app_id', 
    status : true, 
    cookie : true, 
    xfbml : true 
}); 
</script> 
<script type="text/javascript"> 
    window.fbAsyncInit = function() { 
     FB.Canvas.setSize({ width: 520, height: 3591 }); 
    } 
    function sizeChangeCallback() { 
     FB.Canvas.setSize({ width: 520, height: 3591 }); 
    } 
</script> 
</body> 
</html> 

、私はまったく同じアプリ3-4回をやった、それが働いていた、だから今はちょうど、表示する画像を変更しました。
Firebugのコンソールを見るとエラーは表示されず、iframe 800pxの高さが表示されます。

答えて

1

[OK]を、明らかにfbAsyncInitが呼ばれることはなかったので、私は次のように手動でメソッドを呼び出すことで問題を修正:

<script type="text/javascript"> 
    window.fbAsyncInit = function() { 
     FB.Canvas.setSize({ width: 520, height: 3591 }); 
    } 
    function sizeChangeCallback() { 
     FB.Canvas.setSize({ width: 520, height: 3591 }); 
    } 
    window.fbAsyncInit(); 
</script> 

今、すべてが正常に動作します。
誰かがこれがなぜffでのみ起こっているのか、そしてこのアプリケーションだけであるのか(私が質問したところでは、正確なアプリを3〜4回作りました - 異なる画像とテキストで - )感謝しますここで共有する...

+1

http://stackoverflow.com/questions/5316478/facebook-tab-height-scroll-bar/7812412#7812412も参照してください。 –