20

我需要移动与 facebook like 按钮关联的弹出评论框。我知道这个问题已经被问过并解决了无数次。

以前问过：Facebook Like Widget on Fan page，评论区超出可见区域

与我相同问题的屏幕截图：http: //twitpic.com/4q7ggi

这里的不同之处在于，我相信 Facebook 在过去几个月内已经改变了实现，因此“赞”按钮和评论弹出窗口都包含在一个 iframe 中。我预计他们可能会这样做，因为这将是防止恶意网站通过自动喜欢内容来利用用户的唯一可靠方法。但是，这意味着我不能应用 CSS 来重新定位评论框。

我正在使用类似 HTML5 的按钮实现，这与官方 facebook 参考中使用的类似按钮http://developers.facebook.com/docs/reference/plugins/like/相同。要查看示例，请再次单击 facebook 参考页面上的点赞按钮，然后检查评论弹出元素。您会看到点赞按钮和评论弹出窗口都包含在同一个 iframe 中。

4

4 回答 4

4

这在过去对我有用。

.fb-like.fb_edge_widget_with_comment.fb_iframe_widget span iframe {
    /* Now you can apply css here */
    bottom:0!important;
}
于 2013-03-15T17:03:50.110 回答
2

您不能更改iframe 内评论框的 CSS，因为它违反了同源策略：

该策略允许在源自同一站点的页面上运行的脚本无特定限制地访问彼此的方法和属性，但禁止跨不同站点的页面访问大多数方法和属性。

可以使用 CSS 更改发送到框的消息，因为它不驻留在 iframe 中。

于 2013-02-27T00:40:30.467 回答
1

这对我有用，这是一个小提琴示例。我所做的只是用 css 进行简单的修改：

.fb_edge_widget_with_comment span.fb_send_button_form_widget {
  top:100px!important;  /*for example*/
  left:100px!important;        /*for example*/
}

​希望这会有所帮助。

于 2012-12-19T11:57:34.547 回答
0

我查看了 Facebook 示例，看到了这个评论框：http ://screencast.com/t/fRQyUzqek

我检查并将样式应用于此类：

.-cx-PRIVATE-pluginCommentFlyout__full {
    top: 100px!important;
    left: 100px!important;
}

这移动了评论框。但是，我直接在检查器中执行此操作，因此当您在 CSS 中使用它时，您可能还需要包含父选择器才能真正具体。

希望这可以帮助！

于 2013-01-23T20:07:13.830 回答