Getting Equal Height Columns jQuery Plugin and Disqus to Play Nice

问题

I decided that a JS solution (The EqualHeights Plugin) to equal height columns would probably be best in this case, but I'm having trouble with Disqus. As you probably already know, Disqus loads asynchronously. That's great and all (well, not really), but because the comments are loading after everything else, including the plugin, they're being chopped off. I can't figure out how to get around this. I actually tried a CSS "hack" to get equal height columns, hoping it wouldn't conflict with Disqus, but I didn't have any luck there either.

Thanks in advance, guys. You're always invaluable here.

Disqus Code:

    <script type="text/javascript">var disqus_url = "{Permalink}"; var disqus_title ="{block:PostTitle}{PostTitle}{/block:PostTitle}";</script>{block:Permalink}<div id="disqus_thread"></div>
<script type="text/javascript">
  /**
    * var disqus_identifier; [Optional but recommended: Define a unique identifier (e.g. post id or slug) for this thread] 
    */
  (function() {
   var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
   dsq.src = 'http://escapology.disqus.com/embed.js';
   (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
  })();
</script>
<noscript>Please enable JavaScript to view <a href="http://disqus.com/?ref_noscript=escapology">comments.</a></noscript>
{/block:Permalink}<script type="text/javascript">
var disqus_shortname = 'escapology';
(function () {
  var s = document.createElement('script'); s.async = true;
  s.src = 'http://escapology.disqus.com/count.js';
  (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
}());
</script>

回答1:

You can defer the plugin execution until after disqus is loaded. Here's how you'd do it for one of your disqus threads. Do this for each one:

(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'http://escapology.disqus.com/embed.js';
var done=false;
dsq.onload=dsq.onreadystatechange = function(){
      if ( !done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete') ) {
        done=true;
        //CALL YOUR EQUAL HEIGHTS JQUERY CODE HERE
        dsq.onload = dsq.onreadystatechange = null;
      }
    };
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();

来源：https://stackoverflow.com/questions/5853440/getting-equal-height-columns-jquery-plugin-and-disqus-to-play-nice

标签

javascript

jquery

tumblr

disqus