Facebook javascript SDK: FB.Canvas.setAutoResize iFrame не работает?
мы создали приложение facebook с ruby /rails и facebooker (приложение iframe) и в настоящее время застряли в FB.Canvas.setAutoResize, который, кажется, в некоторых случаях терпит неудачу. используя пример из документации разработчика facebook (см. http://developers.facebook.com/docs/reference/javascript/). автоопределение не удастся, если вы введете страницу, которая превышает 800 пикселей - так сказать, она работает только до тех пор, пока холст становится больше, а не когда он становится меньше. у кого есть подсказка или, может быть, обходной путь?
вот фрагмент кода изменения размера
<div id="fb-root" style="width:1px;height:1px;position:absolute;"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: '126342024064822', status: true, cookie: true, xfbml: true});
FB.Canvas.setAutoResize(true,100);
};
(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>
Я очень благодарен за любые комментарии или подсказки, так как я кручу свою голову вокруг этого уже больше дня.
Ответы
Ответ 1
Некоторые ключевые моменты, которые необходимо сделать, устанавливаются в настройках приложения:
- Настройки холста → Метод рендеринга = iFrame
- Настройки холста → iFrame Size = Resizable
- Миграции → новый SDK = Включено
Затем настройте свой код, добавив тайм-аут (250, кажется, лучше всего работает, но вы можете поэкспериментировать с futther). Я тестировал это в FF3.6 и IE7+. В IE есть мгновенная вспышка вертикальной полосы прокрутки, которую я все еще пытаюсь исправить.
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: '12345678910', status: true, cookie: true, xfbml: true});
window.setTimeout(function() {
FB.Canvas.setAutoResize();
}, 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>
Ответ 2
решение легко!
помимо размещения FB.Canvas.setAutoResize()
вам нужно изменить тело ура на тело style = "overflow: hidden"
он работает для меня! теперь ie8 нормально!!
Ответ 3
Я также хотел бы отметить, что вам действительно нужен ваш
<div id="fb-root">
для этого.