Кнопки социальных сетей внутри скрытого Div - PullRequest
Новая
       19

Кнопки социальных сетей внутри скрытого Div

1 голос
/ 12 марта 2012

Кто-нибудь смог получить кнопки Facebook Like, Twitter Follow и Google +1 для работы внутри расширения Chrome.

Я могу заставить отображаться кнопки и некоторые функции, но, похоже, отсутствуют детали. Например, кнопка «Мне нравится» не запоминает, понравилась ли она вам, она показывает счетчик 1 каждый раз. Twitter не показывает правильное количество подписчиков и пропускает @username после текста «Follow».

Я знаю, что расширения находятся в песочнице. Кто-нибудь нашел способ обойти это? Пример? Код

UPDATE

Проблема в том, что кнопки социальных сетей находятся внутри скрытого элемента div (отображение: нет). DIV использует slideToggle jQuery, чтобы показать и скрыть. По умолчанию div не отображается, и кнопки социальных сетей на нем. Когда я помещаю кнопки социальных сетей в не скрытый элемент div, они работают нормально. Любые решения?

Проблема заключалась в том, что кнопки социальных сетей находятся внутри скрытого элемента (другой экран, доступ к которому можно получить через вкладку). Есть ли способ заставить их работать без обновления z-index при инициируемых событиях?

Ответы [ 2 ]

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

Проблема решена. Я добавил разметку на страницу разметки и сразу после запуска slideToggle сделал анонимный вызов функции для скрипта API. Работает отлично.

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

Они работают на странице расширения.Вы должны явно указать общедоступный URL, а facebook / twitter должны быть изменены, чтобы явно включить протокол.//platform.twitter.com до https://platform.twitter.com

popup.html 

<html>
<body>
  <a href="https://twitter.com/twitter" class="twitter-follow-button" data-show-count="false">Follow @twitter</a>
  <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

  <div id="fb-root"></div>
  <script>(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "https://connect.facebook.net/en_US/all.js#xfbml=1&appId=113869198637480";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>
  <div class="fb-like" data-href="http://example.com" data-send="false" data-layout="button_count" data-width="250" data-show-faces="false"></div>

  <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
  <g:plusone href='http://example.com'></g:plusone>
</body>
</html>

manifest.json 

{
  "name": "test",
  "version": "1",
  "browser_action": {
    "default_popup": "popup.html"
  }
}
...