0

誰かをホッピングすることはこれを助けることができます。

誰かが私たちの製品ページの1つで「いいね」をクリックすると、ドロップダウンするコメントセクションがtwitter / googleソーシャルボタンの後ろにあり、問題がどこにあるのか正確に特定できないようです。オーバーフローを表示/自動に設定しようとしましたが、運が悪かったのですが、高さを変更すると問題なく表示されます（高さを変更したくないのですが、上に表示されます）。

以下のコードはFacebookボタンの周りにあります：

<div class="product-link">


    <iframe src="http://www.facebook.com/plugins/like.php?href=http://foscam-uk.com/indoor-ip-cameras/foscam-fi8918e-black-wired-ip-camera.html&send=false&layout=standard&width=450&show_faces=true&action=like&colorscheme=light&appId=317980981630590"

        scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:auto; width:450px; height:30px">" </iframe>

<a href="https://twitter.com/share" class="twitter-share-button" data-via="FoscamUK">Tweet</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="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script><g:plusone size="medium"></g:plusone></div>


        </div>

また、製品ページへのリンク（おそらくもう少し便利です）： http： //foscam-uk.com/foscam-fi8910w.html

どうもありがとうございました。

よろしく

4

1 に答える 1

1

iframeの高さとオーバーフローの組み合わせは、期待どおりに機能していないようです。

私の提案：iframeをDIV要素に埋め込み、そのDIV要素を次のようにフォーマットします。

<div id="foobar"><iframe …&gt;</div>

#foobar {
  height:   30px:
  overflow: hidden;
  position: relative;
  z-index: 1;
}
#foobar:hover {
  overflow: visible;
}

その後、コメントバーがtwitter /g+ボタンの上に表示されます。

ただし、すでにページを高く評価しているユーザーの「顔」は、twitter /g+ボタンの上に表示されます。&show_faces=true顔の表示は目的のページレイアウトに実際には適合しないため、iframeのURLからパラメータを削除することをお勧めします。

于 2012-08-25T13:18:28.057 に答える