html5 – 如何在移动方向更改时重置Disqus宽度

我有一个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>