Высота приложения на временной шкале застряла на 800 пикселей - PullRequest
5 голосов
/ 09 марта 2012

Я занимаюсь разработкой приложения для страницы Facebook с макетом «временная шкала» и хочу, чтобы высота приложения масштабировалась вместе с контентом, но высота приложения установлена ​​на 800 пикселей.

Текущие настройки приложения показывают, что высота установлена ​​на «плавный», но я также пытался зафиксировать высоту на случайных значениях и не наблюдал никаких изменений.

Как мне увеличить высоту моего приложения, чтобы масштабировать его содержимое?Спасибо за любые ответы.

Обновление: добавление этого тега к моему телу сработало.

<body onload="FB.Canvas.setSize({width: 810, height: 910})">
<div id="fb-root"></div>
<script>
(function () {
    var e = document.createElement('script');
    e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js#xfbml=1&appId=YOURAPPID;
    e.async = true;
    document.getElementById('fb-root').appendChild(e);
} ());
</script>

Но я понятия не имею, почему это сработало, поэтому думаю, что я изменю свой вопрос на'Что делает приведенный выше код?'так что я могу понять, какие шаги предпринять в следующий раз.Я пока оставлю это как ответ, чтобы закрыть вопрос.

Ответы [ 3 ]

8 голосов
/ 09 марта 2012

Это правильный способ настроить вещи, я просто должен был пялиться на это некоторое время и читать документацию слишком много раз.Поместив следующее ниже, fb-root div работал как чемпион.

window.fbAsyncInit = function () {
    FB.init({
        appId: 'YOURAPPID', // App ID
        channelUrl: '/channel.html', // Channel File
        status: true, // check login status
        cookie: true, // enable cookies to allow the server to access the session
        xfbml: true  // parse XFBML
    });
    FB.Canvas.setAutoGrow(); //Resizes the iframe to fit content
};
// Load the SDK Asynchronously
(function (d) {
    var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
    if (d.getElementById(id)) { return; }
    js = d.createElement('script'); js.id = id; js.async = true;
    js.src = "//connect.facebook.net/en_US/all.js";
    ref.parentNode.insertBefore(js, ref);
} (document));
0 голосов
/ 29 марта 2012

Ответ Ашиша работал хорошо для меня.

Я также включил стиль тела, чтобы полосы прокрутки не появлялись в течение секунды, пока страница загружается:

body {overflow: hidden;}

0 голосов
/ 14 марта 2012

Вставить код JavaScript для увеличения высоты iframe

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

    function sizeChangeCallback() {
    FB.Canvas.setSize({ width: 810, height:1300 });
    }
    </script>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : 'YOUR APP ID',
status : true,
cookie : true,
xfbml : true
});
</script>
...