【问题标题】:Is there any way to change the CSS of the Facebook Like Box?有什么办法可以改变 Facebook Like Box 的 CSS 吗?
【发布时间】:2013-08-07 19:30:40
【问题描述】:

所以我正在尝试通过任何可能的方式来修改 Facebook Like Box 的 CSS。我找到了有问题的价值,我想改变它。这是在 iframe 内。

CSS 是这样的:

.pluginLikeboxStream {
overflow-x: hidden;
overflow-y: auto;
}

这导致 Like Box 流上总是有一个滚动条,我真的非常不想要。

无论如何我都没有看到要修改它 - 不是 Javascript SDK(我认为这是我最大的希望),不是通过在其上使用 Javascript 或 jQuery(因为它创建了一个 iframe,这是不可能的,就我看得出来——尽管 Firebug 让我改变了这一点)。

显然最好的解决方案是能够使用 CSS 设置样式,但这似乎也是不可能的。

有没有办法解决这个问题?

我尝试加载没有滚动条的 iframe,但这只是在 iframe 的外部 - 这显然是内部的。

我想要的只是将这个类设置为overflow: hidden;

【问题讨论】:

    标签: javascript css facebook


    【解决方案1】:

    Facebook 官方 Like Box 的 CSS 无法更改,因为它是外部 iframe。

    this 重复阅读更多内容。

    【讨论】:

      【解决方案2】:

      由于您要通过 CSS 更改的内容位于 iframe 中,因此您可以inject a style into the iframe。但正如 Vector 所说,要知道自己在做什么。

      【讨论】:

      • 我不是在改变样式,而是在改变滚动条的位置,因为它所在的位置没有任何意义。
      • 改变滚动条的位置是改变样式的一部分。 CSS 代表级联样式表。 .css 文件中的任何内容都被视为元素样式。
      【解决方案3】:

      您可以创建自己的“点赞”按钮 - 没有点赞数(但您可以解决此问题),然后使用 JS API 来“点赞”网址

      【讨论】:

        【解决方案4】:

        如果你设置了!important,那么它会覆盖应用到该元素的任何其他 CSS

        .pluginLikeboxStream {
            overflow: hidden !important;
        }
        

        !important 只能在这种情况下使用。

        已编辑

        要将它应用到你需要使用 jQuery 的 iFrame

        $('iframe').load( function() {
            $('iframe').contents().find("head")
              .append($("<style type='text/css'>  .pluginLikeboxStream {overflow: hidden !important;} /style>"));
        });
        

        这就是我一直这样做的方式。

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2013-09-04
          • 1970-01-01
          • 1970-01-01
          • 2019-12-26
          • 2017-01-10
          相关资源
          最近更新 更多