社交媒体上的链接下面的按钮不起作用
我在社交媒体页面上使用了以下三个按钮: Facebook、Twitter和Google+。唯一的问题是，Facebook和Twitter按钮上的链接不工作，Google+工作，但另两个不工作，我指的是按钮，在这里你可以看到跟随者/类似计数，然后当你以用户身份点击它时，它跟随/喜欢页面，而不必在页面上运行，但是按钮不能工作，“链接鼠标悬停”甚至不会出现(当你悬停在链接上，鼠标图标从箭头变为一只手)。
我直接从Facebook和Twitter提供的开发工具包中提取了代码。重要的是，我使用css来移动按钮，但是如果我选择不使用css来移动它们，而只是将它们作为缺省设置的随机位置，那么链接就能工作，所以我认为可能会出现问题。
我已经删除了以下页面的链接，但链接仍然应该工作，因为它是"href“，所以不要介意。
html代码：
<!DOCTYPE html>
<html>
<head>
<script src="https://apis.google.com/js/platform.js" async defer></script>
</head>
<body>
<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/sdk.js#xfbml=1&version=v2.3";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div id="header">
</div>
<div id="container">
<div id="content">
</div>
</div>
<div id="footer">
<div class="twitterTextForButton">
Twitter
</div>
<div class="twitter-follow">
<a class="twitter-follow-button"
href="https://twitter.com/"
data-show-count="true"
data-lang="en"
data-show-screen-name="false">
Follow
</a>
</div>
<script>window.twttr=(function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);t._e=[];t.ready=function(f){t._e.push(f);};return t;}(document,"script","twitter-wjs"));</script>
<div class="facebookTextForButton">
Facebook
</div>
<div class="fb-like" data-href="https://test.com" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></div>
<div class="googlePlusTextForButton">
Google+
</div>
<div class="moveGooglePLogo">
<div class="g-follow" data-annotation="bubble" data-height="20" data-href="//plus.google.com/test" data-rel="author"></div>
</div>
</div>
</div>
</body>
</html>css代码：
.fb-like {
position: absolute;
left: 50%;
margin-left: 35px;
bottom: -50px;
}
.twitter-follow{
position: absolute;
left: 50%;
margin-left: 180px;
bottom: 126px;
}
.moveGooglePLogo{
position: absolute;
left: 50%;
margin-left: 325px;
bottom: 126px;
}
.facebookTextForButton{
position: absolute;
color: #ffffff;
top: 30px;
left: 50%;
margin-left: 35px;
}
.twitterTextForButton{
position: absolute;
color: #ffffff;
top: 30px;
left: 50%;
margin-left: 180px;
}
.googlePlusTextForButton{
position: absolute;
color: #ffffff;
top: 30px;
left: 50%;
margin-left: 325px;
}回答 1
Stack Overflow用户
发布于 2015-04-27 12:16:49
对于Google+，您需要一个正确的URL。你必须整理好你的物品。
data-href="https://plus.google.com/+LarryPage"Facebook需要HTTP (参见Like button not showing (except jsfiddle))
您还可以使用Facebook的iframe解决方案。
例如您的按钮：
http://jsfiddle.net/GreenMicrochip/djtbg68x/
-更新-
你使用过正确的链接吗？
Facebook: http://facebook.com/YOURUSER
http//twitter.com/intent/follow?screen_name=YOURUSER推特： http://twitter.com/YOURUSER或http://twitter.com/YOURUSER
你有我可以尝试这个问题的链接吗？
希望这能有所帮助。
问候
https://stackoverflow.com/questions/29884305
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号