3

ajax を使用して読み込まれる Facebook のようなボタンがあります。ボタンは機能しますが、奇妙なことにfirefoxでは表示されません。

<fb:like href="@Model.Url" show_faces="true" height="30" width="400" ></fb:like>

Firefox では、作成された html の高さ = 0px が付属しています。なんで？

<span style="height: 0px; width: 400px;">
<iframe id="f2b3cbcbf388e" class="fb_ltr " scrolling="no" name="f3cdf7e205a545e" style="border: medium none; overflow: hidden; height: 0px; width: 400px;" ....

これは Chrome では発生しません。

Facebookに関連して、bodyタグを閉じる前にこれしかありません

<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 = "//connect.facebook.net/pt_PT/all.js#xfbml=1&appId=00000";
        fjs.parentNode.insertBefore(js, fjs);
    } (document, 'script', 'facebook-jssdk'));</script>
4

4 に答える 4

2

原因はまだ調査中ですが、私の場合は、XFBML parse 時に、含まれる div が非表示になっているためだと思います。まだより良い解決策を探していますが、追加された高さ css を次のように手動でクリアすることで修正できます。

FB.XFBML.parse(document, function(){
    $('.fb_button_container iframe').css('height','');
    $('.fb_button_container .fb-like > span').css('height','');
});

これはjqueryを使用しています...必要に応じて簡単に使用できません。また、この場合、「fb_button_container」クラスのコンテナ内にいいねボタンを追加しました。これは自動生成されたものではありません。

于 2012-12-07T20:52:06.283 に答える
0

私も同じ問題を抱えていました。ボタンは、Firefox を除く他のすべての一般的なブラウザーで正しくレンダリングされました。どういうわけか、スパンのインライン スタイルが Firefox で 0px に設定されていました。theozero のおかげで、ようやくボタンが正しくレンダリングされるようになりました。theozero のように、ページの読み込み時に JS で非表示になる div 内に Facebook の Like ボタンを配置しました。theozero の回答で、Facebook のFB.XFBML.parse のドキュメントを見つけ、最初に提供された Facebook JavaScript SDK (最後の行) の最後に正確に再解析関数を配置しました。

(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 = "//connect.facebook.net/de_DE/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
FB.XFBML.parse();

ボタンがレンダリングされました！

編集：あまりにも早く幸せです。それはうまくいきました。ページの読み込み時にすぐに、ボタンを含む div を非表示にしました。私は、divを再表示するJSに解析関数を入れました。それはうまくいきます。します。しかし、要素がスムーズにトグルしなくなりました... ああ！フェイスブック！穴！

編集：だから！これで完了です。切り替えアクションが終了したときに要素を再解析するために、slideToggle 関数のコールバックとして再解析を呼び出す必要がありました。.slideToggle('slow', function(){ FB.XFBML.parse(); });確かに、いいねボタンが目に見えて突然表示されますが、なんとかボタンをフェードインさせることはできますが、それでも我慢できます。

于 2013-05-30T14:23:32.000 に答える
0

それを理解するのに丸一日かかりましたが、「テストユーザー」でFacebookにログインすると、いいねボタンが見えなくなります. 私の場合、Firefox では常にテスト ユーザーでログインしていましたが、Chrome では通常の Facebook ユーザーでログアウト/ログインしていました (当初、これはブラウザーの問題だと思いました)。

ただし、解決策は、テスト ユーザーからログオフするのと同じくらい簡単でした。

FB ドキュメントでは、すべての機能がテスト ユーザーに対して有効になっているわけではないと指定されていますが (いいね! ボタンはそれらの機能の 1 つです)、少なくともレンダリングされると思いました。とにかく、これが誰かに役立つことを願っています。

于 2013-08-04T21:29:44.530 に答える
0

ページごとに 1 つ以上の Facebook のようなボタンがある場合、彼は奇妙な動作をします。ボタンをリストページではなく詳細ページに移動すると、問題が解決しました。

于 2012-12-07T22:21:29.923 に答える