Facebook: Как убрать вертикальную полосу прокрутки iFrame во вкладке приложения - PullRequest
Новая
       28

Facebook: Как убрать вертикальную полосу прокрутки iFrame во вкладке приложения

9 голосов
/ 14 марта 2011

Я закончил работу с приложением facebbok и в настоящее время застрял при просмотре приложения в виде вкладки приложения facebook ....: отображается вертикальная полоса прокрутки.На самом деле я использовал следующий код для автоматического изменения размера iframe приложения: 

window.fbAsyncInit = function() {
    FB.init({appId: FBAPP_ID, status: true, cookie: true, xfbml: true});
    FB.Canvas.setAutoResize(100);
    //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);
  }());

Размер iframe успешно изменяется при загрузке вкладки приложения, но вертикальная полоса прокрутки видна.Тело моего приложения имеет ширину 520 пикселей, настройки приложения установлены на автоматический размер и режим iframe.Когда я добавляю переполнение: скрытое к html-элементу, полоса прокрутки не видна, но я не хочу использовать переполнение: скрытое для html-тега, поскольку страница также доступна как отдельная страница.

У кого-нибудь есть идеи, как заставить Facebook скрывать вертикальную полосу прокрутки, когда контент соответствует высоте iframe?(или это в настоящее время проблема facebook (... снова)?

Заранее спасибо Денис

Ответы [ 6 ]

5 голосов
/ 01 декабря 2011

После того, как мы попробовали все решения, последнее, что изменило Firefox, добавило overflow: hidden для обоих стилей <html> и <body>.

CSS код выглядит следующим образом: 

html {
    overflow: hidden;
}

body {
    width: 520px;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

IE7 также иногда показывает полосы прокрутки, если вы не установили <body scroll="no">, так что имейте это в виду.

4 голосов
/ 12 сентября 2011

С этой функцией возникли проблемы с появлением вкладок iframe. Отслеживание ошибок содержит довольно много связанных отчетов. По сути, наш опыт показывает, что это абсолютно ненадежно. Иногда он работает как рекламируется, иногда он работает только в некоторых браузерах, иногда он работает в зависимости от способа загрузки SDK JavaScript, иногда один метод работает, а другой - нет, а иногда он вообще не работает.

3 голосов
/ 02 сентября 2011

Это код, который я использую, который работает для меня 

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
 appId  : '7575671676127', //enter your app id here
 status : true, // check login status
 cookie : true, // enable cookies to allow the server to access the session
 xfbml  : true// parse XFBML
 });

 FB.Canvas.setAutoResize(7);
 </script>
2 голосов
/ 13 июля 2012

На самом деле FB.Canvas.setAutoResize () теперь известен как FB.Canvas.setAutoGrow ();он обновляется каждые 100 миллисекунд Документы Facebook

, поэтому код должен выглядеть примерно так: atm 

<div id="fb-root"></div>
<script type="text/javascript">
FB.init({
         appId  : '666',//your app id
         status : true,
         cookie : true,
         xfbml  : true
     });
FB.Canvas.setAutoGrow();
</script>
2 голосов
/ 29 августа 2011

Просто убедитесь, что вы поместили переполнение: скрытое правило стиля для элемента body.В другом случае Firefox когда-нибудь решит показать полосу прокрутки.

2 голосов
/ 24 марта 2011

Зайдите в настройки вашего приложения -> Интеграция с Facebook и выберите «Размер IFrame» = Авторазмер

...