Facebook 的分享按钮有问题

Question

有 2 个问题，我认为 1 个与 HTML/CSS 相关，另一个与 JavaScript 相关。

第一个是这个 - 我在正确定位它时遇到了一些问题（它没有对齐）。当我将它设置为 display: inline-block; 时，它重新定位到其他也设置为内联块的共享按钮下方。除 Facebook 的按钮外，所有 3 个按钮都正确对齐。

第二个问题似乎 JavaScript 相关。该按钮可能会在页面上的其他所有内容加载后一秒钟后加载，我完全不知道为什么。

下面是一些代码：

我的分享按钮：

<div class="fb-share-button" data-href="http://onyx.space/image/41" data-layout="button" data-size="small" data-mobile-iframe="true"></div>

javascript.js

(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 = 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v3.0';
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

CSS 使它们成为内联块；

.twitter-share-button {
    display: inline-block !important;
}
.fb-share-button {
    display: inline-block !important;
}

Answer 1

这两个问题都是因为 css。我认为您的 HTML DOM 行为不端。对于共享按钮的澄清和不同的悬停效果，请检查按钮是否在悬停时闪烁。 不同的悬停效果 - 如果您的按钮有背景色，请在悬停时将其更改为文本颜色。如果它闪烁，您需要先正确排列 DOM。

你的javascript看起来很清楚

Facebook 的分享按钮有问题

Having some issue with facebook's share button

html

javascript

css

facebook

facebook-javascript-sdk