Facebook-приложение: как я могу изменить высоту изменяемого размера приложения iframe? - PullRequest
5 голосов
/ 01 апреля 2010

Я создал приложение для Facebook и настроил следующее:

Размер кадра: изменяемый Ширина холста: 760 пикселей (без использования fbml)

Кажется, что независимо от того, как я настраиваю свою HTML-страницу, высота iframe составляет 800 пикселей. мое приложение нуждается в большем, чем, как я могу настроить iframe приложения facebook, чтобы иметь большую высоту?

спасибо!

Ответы [ 5 ]

10 голосов
/ 01 апреля 2010

Установка для параметра «Размер холста» значения «Изменяемый» Iframe само по себе не изменяет размер холста в соответствии с вашим контентом. Есть пара других вещей, которые вы должны сделать. Посетите вики-страницу Resizable IFrame для получения подробных инструкций.

Вам необходимо создать HTML-страницу, известную как «междоменный получатель» (которая так же проста, как копирование и вставка файла примера), а затем скопировать фрагмент кода Javascript внизу всех страниц приложения. , Javascript выполнит изменение размера iframe после загрузки контента.

Страница вики улучшилась с момента моего последнего использования, так что, надеюсь, она довольно проста. Если у вас возникли проблемы с его работой, убедитесь, что вы соответствующим образом изменили фрагмент кода JavaScript, чтобы он указывал на вашу страницу междоменного получателя.

Обновление январь 2011 - Пришло несколько комментариев, поэтому я решил обновить. Я полагаю, что этот ответ все еще более или менее правильный, хотя документация изменилась. Facebook отошел от FBML и обновил свои Javascript SDK. Текущий метод загрузки Javascript SDK находится на главной странице Javascript SDK , а внизу приведены методы, которые можно использовать для изменения размера холста, FB.Canvas.setAutoResize () и FB.Canvas.setSize () . Вам по-прежнему нужно настроить свой холст как изменяемый в настройках приложения. Похоже, что они, возможно, заменили потребность в междоменном файле новым SDK, но я сам еще не проверял.

2 голосов
/ 08 ноября 2012

FB.Canvas.setAutoGrow ()

Примечание. Этот метод включается только в том случае, если в панели инструментов приложения для параметра «Высота холста» задано значение «Fixed at (800) px»)

Запускает или останавливает таймер, который будет увеличивать ваш iframe, чтобы соответствовать контенту каждые несколько миллисекунд. Время ожидания по умолчанию составляет 100 мс.

Используется как FB.Canvas.setAutoResize .

.

http://developers.facebook.com/docs/reference/javascript/FB.Canvas.setAutoGrow/

2 голосов
/ 31 августа 2011

Я поместил этот код в конец моего файла содержимого HTML iFrame непосредственно перед закрывающим тегом, и теперь он отлично работает.

<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, // check login status
    cookie : true, // enable cookies to allow the server to access the session
    oauth  : true // enable OAuth 2.0
  });
  FB.Canvas.setAutoResize();
</script>

Очевидно, поместите свой APPID туда ...:)

1 голос
/ 17 января 2011

Хотя вики больше не существует, я обнаружил эту страницу и думаю, что, возможно, именно об этом говорил Зомбат.

http://apps.facebook.com/wzhu_public_resize/

0 голосов
/ 26 августа 2011

Facebook недавно ввел новую «плавную» настройку ширины и высоты холста, что позволяет использовать размеры холста, превышающие обычную ширину 760 пикселей http://developers.facebook.com/blog/post/538/ (12 августа 2011 г.).

Чтобы изменить настройку:

1) Перейдите на страницу настроек приложения Facebook.

2) Выберите Дополнительно.

3) В разделе Настройки холста установите Ширина холста в жидкость. Это позволяет приложению занимать почти всю ширину экрана.

То же самое можно сделать для высоты.

Дополнительно : есть предположение, что это было в ответ на собственные усилия Google на игровой арене http://tutorial -on.blogspot.com / 2011/08 / facebook-features-new- игровой холст-and.html

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...