Прокрутка на холсте Facebook - PullRequest
Новая
       29

Прокрутка на холсте Facebook

3 голосов
/ 30 марта 2011

Я создаю приложение для Facebook.Тип холста Facebook - FBML, затем я помещаю fb: iframe на страницу индекса, загружаю свой движок ajax внутри этого iframe, и после этого весь контент обновляется через ajax.Иногда страницы содержимого могут быть длинными и требовать от пользователя прокрутки вниз (с помощью главной полосы прокрутки браузера).Но когда вы нажимаете на ссылку после прокрутки вниз и загружается следующая страница контента, полоса прокрутки остается там, где она была (что имеет смысл), поэтому вам нужно прокрутить страницу вверх.

Мне удалось решить эту проблему путем принудительной прокрутки после загрузки данных.И он попадает в верхнюю часть div, но не в верхнюю часть страницы, где находится панель facebook.Я попытался прокрутить родительское окно, но это невозможно из-за ограничений безопасности между сайтами.

Я заметил, что когда вы используете FB.ui (то есть для создания потока для публикации) из того же места, гдеЯ загружаю свой контент, он прокручивается до самого верха.Так что я думаю, может быть, есть вызов API FB, чтобы сделать это, но я не могу найти его.

Или, может быть, каким-то образом заставить браузер прокручивать все вверх, независимо от того, находитесь ли вы в iframe?

Есть идеи?

1 Ответ

8 голосов
/ 30 марта 2011

ОБНОВЛЕНИЕ Апрель 2011: Facebook добавил метод FB.CanvasClient.scrollTo в свой новый JavaScript SDK.Все, что вам нужно сделать сейчас, это: 

FB.Canvas.scrollTo(0,0);

Более подробная информация здесь: http://developers.facebook.com/docs/reference/javascript/FB.Canvas.scrollTo/

ОБНОВЛЕНИЕ Апрель 2011: следующее содержание устарело, но я 'я оставляю его здесь для справочных целей ...

Используете ли вы новый SDK JavaScript или старый?Со старым вы можете сделать это:

FB.CanvasClient.scrollTo (0,0)

К сожалению, Facebook не поддерживает метод scrollTo () с новым JavaScript API.Я не пробовал эту следующую технику с приложением FBML, но у меня был успех, используя его в приложении Canvas iframe (код заимствован здесь: http://forum.developers.facebook.net/viewtopic.php?id=32906):

var x = 0, y = 0;
$("body").append('<iframe id="scrollTop" style="border:none;width:1px;height:1px;position:absolute;top:-10000px;left:-100px;" src="http://static.ak.facebook.com/xd_receiver_v0.4.php?r=1#%7B%22id%22%3A0%2C%22sc%22%3Anull%2C%22sf%22%3A%22%22%2C%22sr%22%3A2%2C%22h%22%3A%22iframeOuterServer%22%2C%22sid%22%3A%220.957%22%2C%22t%22%3A0%7D%5B0%2C%22iframeInnerClient%22%2C%22scrollTo%22%2C%7B%22x%22%3A' + x + '%2C%22y%22%3A' + y + '%7D%2Cfalse%5D" onload="$(\'#scrollTop\').remove();"></iframe>');

Хотя вышеуказанная техника будетпрокрутите окно до вершины, я не нашел его надежным на 100%. Например, оно не работает на новых вкладках Facebook iframe. Поэтому я прибег к использованию этой 100% надежной техники, но, к сожалению,он будет прокручиваться только до верхней части iframe:

Поместите это чуть ниже открывающего тега: 

<a id="top" name="top" style="display:block;height:1px;width:1px;"></a>

И JavaScript, который будет выполнять прокрутку; 

     window.location.hash = 'top';
     window.location.hash = '';
...