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的分享按钮有问题

1 个答案: