Вопросы Теги

Значок соединения Facebook не обнаруживается в Internet Explorer

Я работаю над сайтом, который использует Подключение Facebook и недавно внес некоторые изменения так, чтобы основные страницы кэшировались и если Вы не зарегистрированы (сверился с вызовом ajax), оно загружает Подключение Facebook JavaScript и представляет кнопку соединения в странице. Это работает отлично везде кроме Internet Explorer 7 и 8. Странная часть, я представляю кнопки в скрытом, Подписываются / Входят в систему форма и когда Вы показываете любому из тех, Кнопки соединения появляются. Можно смотреть здесь, и Вы будете видеть кнопку в Firefox и не Internet Explorer. При нажатии на Sign In, кнопка обнаружится.

Это - приложение для направляющих так на серверной стороне, мы отвечаем на вызов ajax с rjs как это:

  page['signin-status'].replace(:partial => "common/layout/signin_menu")

  page.select('.facebook-connect').each do |value, index|
    value.replace(render(:partial => '/facebook/signin'))
  end

  page << <<-eos
  LazyLoader.load('http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php', function(){
    FB.init('#{Facebooker.api_key}','/xd_receiver.html');
  });
eos

Первая строка заменяет заголовок, вторыми являются Кнопки соединения в Модальных диалоговых окнах. Частичное, представляемое в заголовке, похоже на это:


  <%= fb_login_button(remote_function(:url => "/facebook/connect"))%> |
  <%= link_to_function "Sign In", "showSignInForm();", :id => "signin" %> |
  <%= link_to_function "Sign Up", "showSignUpForm();", :id => "signup" %>

Частичное, представляемое в Модальных диалоговых окнах, похоже на это:

Я нахожу это очень странным, что показ Модального диалогового окна заставляет все значки показывать. У кого-либо есть какие-либо идеи или предложения о том, что продолжается?

5
задан John Duff 25 March 2010 в 11:25
поделиться

3 ответа

Оказывается, у меня на странице было два div с идентификатором FB_HiddenContainer , и это было причиной проблемы. Удаление дублирующего div исправило все.

1
ответ дан 15 December 2019 в 00:56
поделиться

Трудный. Это не ответ, и вы, возможно, уже все это знаете, но, возможно, это даст вам некоторое представление. Сгенерированный исходный код для Firefox выглядит следующим образом: 

<div class="facebook-connect">
      <div id="FB_HiddenContainer" style="position: absolute; top: -10000px; width: 0px; height: 0px;">
        <div>
          <iframe name="fb_api_server" src="http://api.connect.facebook.com/static/v0.4/client_restserver.php?r=223617" class="FB_SERVER_IFRAME" frameborder="0" scrolling="no"></iframe>
        </div>
        <div>
          <iframe name="loginStatus" src="http://www.facebook.com/extern/login_status.php?api_key=f3da6164fa3c312672cf5a24a53345e0&amp;extern=2&amp;channel=http%3A%2F%2Fplay.inspire2go.com%2Fxd_receiver.html&amp;locale=en_US" class="FB_SERVER_IFRAME" frameborder="0" scrolling="no"></iframe>
        </div>
      </div>
      <label>Or sign in with your Facebook account</label>
      <fb:login-button class=" fb_login_not_logged_in FB_login_button FB_ElementReady" onlogin="new Ajax.Request('/facebook/connect', {asynchronous:true, evalScripts:true})"><a id="RES_ID_fb_login" class="fbconnect_login_button"><img alt="Connect" src="http://static.ak.fbcdn.net/rsrc.php/zEYEC/hash/7e3mp7ee.png" id="RES_ID_fb_login_image"></a></fb:login-button>
    </div>

Однако код, сгенерированный в IE8, выглядит так: 

<DIV class=facebook-connect>
      <DIV style="POSITION: absolute; WIDTH: 0px; HEIGHT: 0px; TOP: -10000px" id=FB_HiddenContainer>
        <DIV>
          <IFRAME class=FB_SERVER_IFRAME src="http://www.facebook.com/extern/login_status.php?api_key=f3da6164fa3c312672cf5a24a53345e0&extern=2&channel=http%3A%2F%2Fplay.inspire2go.com%2Fxd_receiver.html&locale=en_US" frameBorder=0 name=loginStatus scrolling=no></IFRAME>
        </DIV>
        <DIV>
          <OBJECT id=flashXdComm name=flashXdComm classid=clsid:d27cdb6e-ae6d-11cf-96b8-444553540000 width=1 height=1 type=application/x-shockwave-flash>
            <PARAM NAME="_cx" VALUE="26">
            <PARAM NAME="_cy" VALUE="26">
            <PARAM NAME="FlashVars" VALUE="">
            <PARAM NAME="Movie" VALUE="http://static.ak.fbcdn.net/rsrc.php/z9W3G/hash/b0l9i5c3.swf">
            <PARAM NAME="Src" VALUE="http://static.ak.fbcdn.net/rsrc.php/z9W3G/hash/b0l9i5c3.swf">
            <PARAM NAME="WMode" VALUE="Window">
            <PARAM NAME="Play" VALUE="-1">
            <PARAM NAME="Loop" VALUE="-1">
            <PARAM NAME="Quality" VALUE="High">
            <PARAM NAME="SAlign" VALUE="">
            <PARAM NAME="Menu" VALUE="-1">
            <PARAM NAME="Base" VALUE="">
            <PARAM NAME="AllowScriptAccess" VALUE="always">
            <PARAM NAME="Scale" VALUE="ShowAll">
            <PARAM NAME="DeviceFont" VALUE="0">
            <PARAM NAME="EmbedMovie" VALUE="0">
            <PARAM NAME="BGColor" VALUE="869CA7">
            <PARAM NAME="SWRemote" VALUE="">
            <PARAM NAME="MovieData" VALUE="">
            <PARAM NAME="SeamlessTabbing" VALUE="1">
            <PARAM NAME="Profile" VALUE="0">
            <PARAM NAME="ProfileAddress" VALUE="">
            <PARAM NAME="ProfilePort" VALUE="0">
            <PARAM NAME="AllowNetworking" VALUE="all">
            <PARAM NAME="AllowFullScreen" VALUE="false">
          </OBJECT>
        </DIV>
      </DIV>
      <LABEL>Or sign in with your Facebook account</LABEL>
      <?xml:namespace prefix = fb />
      <fb:login-button onlogin="new Ajax.Request('/facebook/connect', {asynchronous:true, evalScripts:true})"></fb:login-button>
    </DIV>

Обратите внимание, что здесь есть несколько отличий. Прежде всего, элемент отличается. Как нам известно, ссылка на файл PNG для входа в систему отсутствует в IE8. Кроме того, в Firefox есть два элемента