隱藏在twitter/google社交按鈕後面的Facebook評論欄

Question

跳躍的人可以幫助解決這個問題。

當有人點擊「喜歡」在我們的產品網頁的下拉式註釋部分去背後的推特/谷歌社交按鈕，我似乎無法準確針點問題所在。我已經嘗試設置溢出可見/自動和沒有運氣，但當我改變高度它似乎好（雖然我不想改變高度，而是它出現在頂部）。

的代碼如下圍繞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

非常感謝你的幫助。

問候

Answer 1

高度和溢出的iframe的結合似乎並不如你預期它的工作。

我的建議：嵌入的IFRAME成DIV元素，和格式DIV元件如下：

<div id="foobar"><iframe …></div> 

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

在此之後，註釋欄應顯示在微/克+按鈕。

但那些已經喜歡你的頁面，然後會顯示在twitter上/ G +按鈕的用戶的「面孔」。我建議你從你的iframe的網址刪除參數&show_faces=true，因爲顯示的面孔不會真正適合你要去的頁面佈局。