Facebook iFrame app - избавление от вертикальных полос прокрутки?

Я преобразовал a Facebook app из FBML в iFrame (с PHP SDK) и теперь имеет вертикальные полосы прокрутки, отображаемые для того же количества контента, что и раньше (логотип, флеш-игра и строка с тремя ссылками ниже). Но раньше у меня не было полос прокрутки.Facebook iFrame app - избавление от вертикальных полос прокрутки?

Если я установил настройку приложения Auto-Resize, то нижняя часть содержимого вообще не отображается - что плохо, тогда флеш-игра не воспроизводится.

Я искал вокруг, и все предлагаемые решения включают Javascript, но я фактически использую PHP SDK. Разве нет решения только для PHP/CSS?

Ниже мой текущий код:

<?php 

require_once('facebook.php'); 

define('FB_API_ID', 'XXX'); 
define('FB_AUTH_SECRET', 'XXX'); 

$facebook = new Facebook(array(
      'appId' => FB_API_ID, 
      'secret' => FB_AUTH_SECRET, 
      'cookie' => true, 
      )); 

if (! $facebook->getSession()) { 
    printf('<script type="text/javascript">top.location.href="%s";</script>', 
     $facebook->getLoginUrl(
       array('canvas' => 1, 
         'fbconnect' => 0, 
         #'req_perms' => 'user_location', 
     ))); 
    exit(); 
} else { 
    try { 
     $me = $facebook->api('/me'); 

     $first_name = $me['first_name']; 
     $city  = $me['location']['name']; 
     $female  = ($me['gender'] == 'male' ? 0 : 1); 
     $avatar  = 'http://graph.facebook.com/' . $me['id'] . '/picture?type=large'; 

    } catch (FacebookApiException $e) { 
     exit('Facebook error: ' . $e); 
    } 
} 

# print the logo, the flash game and 3 links 

?>

Кроме того, я не уверен, что если мой PHP-скрипт должен печатать

<html> 
<body> 
..... 
</body> 
</html>

? В настоящее время я печатаю только то, что находится внутри тела.

И мне интересно, если это хорошая идея, чтобы заменить top.location.href = .... в моем коде заголовок в PHP («Location: ....»);?

источник

2011-05-08 Alexander Farber

Если вы собираетесь использовать метод Asynchronous, рекомендуется поместить в него столько кода FB. Что-то вроде ниже должно работать:

<html> 
<head> 
</head> 
<body> 
<div id="fb-root"></div> 
<script> 
window.fbAsyncInit = function() { 
    FB.init({appId: 'your app id', status: true, cookie: true, 
      xfbml: true}); 
    FB.Canvas.setSize(); 
}; 

function sizeChangeCallback() { 
    FB.Canvas.setSize(); 
} 
(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> 
</body> 
</html>

Теперь вы будете вызывать функцию sizeChangeCallback() всякий раз, когда вы вносите изменения в макет (нажав новую вкладку, загрузка контента Ajax ... и т.д.).

источник

2011-05-09 16:28:14 ifaour

Хорошо, я нашел the solution:

<html> 
<head> 
<script type="text/javascript"> 
window.fbAsyncInit = function() { 
     FB.Canvas.setSize(); 
} 

function sizeChangeCallback() { 
     FB.Canvas.setSize(); 
} 
</script> 
</head> 
<body> 
...... 

<div id="fb-root"></div> 
<script src="http://connect.facebook.net/en_US/all.js"></script> 
<script> 
FB.init({ 
     appId : '<?php print(FB_API_ID); ?>', 
     status : true, 
     cookie : true, 
     xfbml : true 
}); 
</script> 
</body> 
</html>

и установить IFrame Размер в Авто-размер во вкладке настроек.

И заголовок ('Местоположение:'. $ Url); не будет работать по какой-либо причине.

источник

2011-05-08 20:33:47

1) 'header' не будет работать, потому что вы работаете внутри фрейма 2) вы должны обернуть ** все ** FB функции, связанные с JS внутри' метода window.fbAsyncInit' (я имею в виду здесь ' FB.init') – ifaour

К сожалению, нет: я пробовал ваше предложение fbAsyncInit (исходящее из http://developers.facebook.com/docs/reference/javascript/?), И оно не работает с Google Chrome: iframe содержимое просто обрезается внизу. –

что-то вроде [этого] (http://pastebin.com/aDNpR3Kf) должно работать. – ifaour

Я просто собрал довольно обширный учебник по моему блогу, также используя PHP-SDK. Кроме того, чтобы избавиться от этих полос прокрутки, я также покажу, как создать Fan-Gate и простую кнопку Share. Я надеюсь, что смогу помочь некоторым из вас, ребята с этим:

http://net-bites.de/facebook/tutorial-how-to-create-facebook-iframe-pages-for-timeline-width-810px-with-fan-gate-and-share-button/

источник

2012-08-05 18:08:01 Daniel

Хотя эта ссылка может ответить на вопрос, лучше включить основные части ответьте здесь и укажите ссылку для справки. Ответные ссылки могут стать недействительными, если связанная страница изменится. –

Мои гуманного работает каждый раз! Сделайте свое тело переполненным, а затем добавьте это.

<div id="fb-root" class="fb_reset"><script async="" src="https://connect.facebook.net/en_US/all.js"></script></div> 
    <script type="text/javascript"> 
     window.fbAsyncInit = function() { 
      FB.init({appId: '293887700673244', status: true, cookie: true, xfbml: true, oauth: true}); 
      window.setTimeout(function() { 
       FB.Canvas.setAutoGrow(); }, 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>

источник

2014-07-22 15:48:26 Brent

Facebook iFrame app - избавление от вертикальных полос прокрутки?

ответ

Смежные вопросы