我有一个html页面,我使用twitter bootstrap进行响应式布局,我也使用Disqus进行评论.当我最初加载页面时,从我的手机(iPhone 5)开始,所有内容都很好,并且在它的容器中大小有问题(基本上是屏幕的整个宽度).当我将手机旋转到风景和背景时,响应式设计没有任何问题,它会根据我的需要调整大小和行为.问题是在初始页面加载后,我的手机上没有调整Disqus iframe的大小.
我想知道是否有一个好方法让我帮助Disqus重新调整它的自我.
解决方法
在页面上重置大小时重置;).
http://help.disqus.com/customer/portal/articles/472107-using-disqus-on-ajax-sites
这是我的代码：
<script type="text/javascript">
var reset_disqus = function(){
DISQUS.reset({
reload: true,config: function () {
this.page.identifier = '{{ article.url }}';
this.page.url = '{{ SITEURL }}/#!{{ article.url }}';
this.page.title = "{{ article.title }}";
}
});
};
var disqus_shortname = '{{ DISQUS_SITENAME }}';
var disqus_identifier = '{{ article.url }}';
var disqus_title = '{{ article.title }}';
var disqus_url = '{{ SITEURL }}/{{ article.url }}';
(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);
})();
window.onresize = function() { reset_disqus(); };
</script>
