如何单独控制Facebook点赞框中的流部分高度。减小整个框的高度很常见，但是如果尝试控制它，粉丝图像将无法显示。
使用css .fan_box .page_stream{ ...,width:300px} 到 .fan_box .page_stream{...,width:150px}
我之所以问这个问题，是因为流框在iframe内部。
Facebook点赞框流高度
5
- ArK
1
你曾经得到过这个问题的答案吗？我还在寻找解决方案。尝试了jQuery，但它不起作用，因为它在iframe中。尝试传递一个css参数来设置元素的高度，因为其他一些fb元素具有此功能，但是没有成功。 - miccet
7个回答
4
无法更改高度。Facebook没有提供更改高度的方法，也没有使用JavaScript和CSS更改高度的方法。
为什么无法使用JavaScript和CSS进行更改？
CSS不能应用于iFrame，因为iFrame就是另一个带有自己CSS的页面的窗口。
如果iFrame的URL与包含iFrame的页面不同，则JavaScript不允许您访问iFrame的内容。例如：
document.getElementById('iframeID').contentWindow.document
在Chrome中，您将收到以下警告。
Unsafe JavaScript attempt to access frame with URL... Domains, protocols and ports must match.
这样做是为了防止XSS攻击。关于同源策略，这里有更多信息。
- squinlan
1
你可以减小包围div的高度，隐藏其溢出，并且如果你想要把它的顶部推到一个具有更高z-index值的绝对定位元素下面，就像这样：
<div style="position:absolute;z-index:2;top:0;left:0;width:300px;height:130px;background-color:#c0c;opacity:0.5;filter:alpha(opacity=50);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";"></div>
<div style="height:140px;width:140px;overflow:hidden;background-color:#0c0; margin-top: 60px;color: #fff;padding: 30px;font-family:arial;">
facebook like box goes here - only the green part will be visible if you make the pink box white and take out the 0.5 opacity and the bottom will get cut off so you can just display whatever part you want
</div>
- Tania
1
我在 Like Box 页面上看到了这个，并想回复您可以使用 'data-height' 属性：
data-height="250"
对我有用。这是我的示例：
- Skowronek
1
1这只能缩短数据高度。看起来最大数据高度大约在300像素左右。 - Matias Nino
0
我想你们仍然需要它，这是我能提供的最准确的技巧，也有望适应 Facebook 每天变化的点赞框。
这有点棘手，但会对你们有用。
创建两个单独的相同页面的点赞框，并将它们分别关闭在不同的 div 中，就像我的情况一样。
<div class="up1">
facbook like box 1 code
<div class="up2">
facbook like box 2 code
现在在 CSS 中
使用绝对定位到 up1 类
.up1 {
position:absolute;
z-index:99999;
background-color:white;
}
并且在up2中
.up2 {
padding-top:87px;
}
它的功能是将盒子1放在盒子2上面，隐藏它的Facebook赞和其他内容，这样您就感觉有一个包含所需长度图片和流媒体的盒子。
- Ubaid Rehman
0
是的，将data-height设置为250将起作用，因为它会减小外部iframe。
现在尝试将data-height设置为1000-仍然是300px高度，
因为iframe内部的内部div硬编码为300px，您无法控制它，因为它在跨域iframe中...
- Max Chernyshov
0
我在寻找解决类似问题的方法。如果勾选了头像和标题，Facebook没有标准的自定义流的方式。
解决方案是分别处理它们。如果您需要流的长度为1000px，只需取消选择除流以外的所有内容。这将使其高度从默认的300px更改为您在高度字段中输入的任何值。
请参见下面的示例：
<div class="fb-like-box" data-href="https://www.facebook.com/MadeinHeavenEvents" data-width="800" data-height="2000" data-colorscheme="light" data-show-faces="false" data-header="false" data-stream="true" data-show-border="true"></div>
如果你仍然需要带有面孔的那个，请获取新代码并设置不同的高度，然后取消选中其他内容。以下是一个示例：
<div class="fb-like-box" data-href="https://www.facebook.com/MadeinHeavenEvents" data-width="800" data-height="500" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="false" data-show-border="true"></div>
在这些代码之前不要忘记添加SDK。
我知道这篇文章已经发布很久了，但是这是今天帮助我的解决方案。
- Ekene
-1
<div class="fb-like-box" data-href="http://www.facebook.com/example" data-width="292" data-height="250" data-show-faces="true" data-stream="false" data-header="false"></div>
将此代码中的height调整为最适合您的值。
- Jide Ogunsanya
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接