我在我的网站上使用disqus,并且我添加了一个用于显示/隐藏评论的按钮。这个按钮在Chrome,Opera(和我猜的IE)上运行正常但在Firefox上失败了。
它失败了,因为当我点击按钮时,我没有显示带注释的div。 div似乎没有大小。如果我更改窗口浏览器大小... \°/ 我看到了评论!为什么?
<p id="commentsButton">
<button id="buttonComment" onclick="toggleComments()">
Commentaires</button>
</p>
<script type="text/javascript">
function toggleComments(){
if (document.getElementById("comments").style.display == "none"){
document.getElementById("comments").style.display="inline";
} else {
document.getElementById("comments").style.display="none";
}
}
</script>
似乎disqus ifame有风格
style="height: 0px !important
我能做什么?
答案 0 :(得分:1)
toggleComments()
函数内部来解决此问题,以便在该元素可见时加载它。
请确保将配置变量(例如disqus_shortname
)保留在函数外部。总之,它看起来像这样:
<script type="text/javascript">
var disqus_shortname='YOUR_SHORTNAME';
function toggleComments(){
if (document.getElementById("comments").style.display == "none"){
document.getElementById("comments").style.display="inline";
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
}
else {
document.getElementById("comments").style.display="none";
}
}
}
</script>