jQuery 如何删除“Facebook 社交插件”文本？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4870082/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to remove the "Facebook social plugin" text?
提问by Yuval Karmi
I'm using the comments facebook social pluginWhen I embed it, the script created an iFrame that has the text "Facebook social plugin" with the facebook logo at the bottom (as seen in the image attached below).
我正在使用评论facebook 社交插件当我嵌入它时，脚本创建了一个 iFrame，其中包含文本“Facebook 社交插件”，底部带有 facebook 徽标（如下图所示）。
I inspected the element using Firebug and tried to set its class to display:none;in my CSS file. However - that does not hide it (I suspect it's because it's in its own iFrame). How can I use CSS or jQuery (or any other method) to disable that text?
我使用 Firebug 检查了该元素，并尝试display:none;在我的 CSS 文件中设置它的类。但是 - 这并没有隐藏它（我怀疑这是因为它在它自己的 iFrame 中）。如何使用 CSS 或 jQuery（或任何其他方法）禁用该文本？
Thanks!
谢谢！
采纳答案by Brian
You're overcomplicating things. Small CSS change...
你把事情复杂化了。小的 CSS 更改...
.fb_iframe_widget{overflow: hidden;}
.fb_ltr{margin-bottom: -20px;}
Done!
完毕！
Sidenote - I agree with the warning about legal issues. You shouldn't really do this.
旁注 - 我同意有关法律问题的警告。你真的不应该这样做。
回答by ifaour
You can only control the options given to you by the plugin developer (here, Facebook). Most plugin developers do not allowaltering their code and Facebook is one of them. I suggest you stick to what Facebook provides you.
您只能控制插件开发人员（此处为 Facebook）提供给您的选项。大多数插件开发人员不允许更改他们的代码，Facebook 就是其中之一。我建议你坚持 Facebook 为你提供的内容。
Have a read of the following:
请阅读以下内容：
回答by sokratisg
If it's a CSS issue for the iFrame then you can't do anything about it (eg: overide it). It is loading from another site so you don't have control over it.
如果这是 iFrame 的 CSS 问题，那么您将无能为力（例如：覆盖它）。它是从另一个站点加载的，因此您无法控制它。
回答by joecasper
I ran into this issue as well. I fixed it by setting the height of the iframe using an inline style and set overflow to hidden.
我也遇到了这个问题。我通过使用内联样式设置 iframe 的高度并将溢出设置为隐藏来修复它。
Example: iframe is 185px. Add this inline:
示例：iframe 为 185 像素。添加这个内联：
style="overflow:hidden; height:160px;"
风格=“溢出：隐藏；高度：160px；”
回答by vulgarbulgar
.fb_iframe_widget {overflow: hidden;}
div.fb-comments.fb_iframe_widget span {margin-bottom: -35px;}
回答by Sara Farooqui
Css
css
.facebookOuter { width:248px; padding:10px 0px 10px 10px; height:230px; overflow:hidden; } .facebookInner { height:250px; width: 238px; overflow: hidden; }
And Like Box
和喜欢盒子
<div class="facebookOuter"> <div class="facebookInner"> <div class="fb-like-box" data-width="250" data-height="300" data-href="http://www.facebook.com/myhumourbook" data-border-color="dodgerblue" data-show-faces="true" data-stream="false" show_border=false data-header="false"> </div> </div> </div> <div id="fb-root"></div> <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/en_US/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); </script>
回答by J. Scott Elblein
If you play around with the box's dimensions, you can sort of make it disappear on it's own, and you haven't even technically broken their terms, because you haven't modified their code using your own hacks. =)
如果你玩弄盒子的尺寸，你可以让它自己消失，而且你在技术上甚至没有违反他们的条款，因为你没有使用你自己的黑客修改他们的代码。=)
Example:
例子：
The dimensions on this one are 310x382. You can still see it poking it's head up, but essentially it's hidden enough that anyone just glancing over your page won't really notice it much. And since most surfers tend to speed read ...
这个尺寸是 310x382。您仍然可以看到它朝上戳，但本质上它已经足够隐蔽，任何人只要瞥一眼您的页面就不会真正注意到它。而且由于大多数冲浪者倾向于快速阅读......
回答by Max
I used the following code to get rid of it. It seems to be the most up to date one that is working. Just change the margin-bottom to your liking.
我使用以下代码来摆脱它。它似乎是最新的工作。只需根据自己的喜好更改边距底部即可。
.fb_iframe_widget {
overflow: hidden;
}
.fb_iframe_widget span {
margin-bottom: -30px;
}
回答by Chris Moschini
The other solutions have the side effect of pushing things down. Here's a Less/Sass/SCSS solution that accounts for the pull down:
其他解决方案具有将事情推倒的副作用。这是一个 Less/Sass/SCSS 解决方案，它解释了下拉：
div.fb_iframe_widget span {
overflow: hidden;
margin-top: -32px;
iframe {
top: 32px;
}
}
They've set the iframe to position: absolute, presumably to reduce your chances of pulling this off. That makes top easy to set, and voila.
他们已将 iframe 设置为position: absolute，大概是为了减少您将其关闭的机会。这使得顶部易于设置，瞧。
They also set their iframe to overflow: hidden, so you can attack that with a shorter style if you prefer, and just end up with a larger gap at bottom of the comments box:
他们还将他们的 iframe 设置为 overflow: hidden，所以如果你愿意，你可以用更短的样式来攻击它，最终在评论框底部留下一个更大的间隙：
div.fb_iframe_widget iframe {
box-sizing: border-box;
padding-bottom: 32px;
}
Chomp.
咀嚼。
回答by Neil
See the iframe example in the description of the .contents()method.
请参阅.contents()方法说明中的 iframe 示例。
You can easily access the DIV (or whatever) and modify the CSS for it, or manipulate any other way.
您可以轻松访问 DIV（或其他任何内容）并为其修改 CSS，或以任何其他方式操作。
