How to auto resize the height of an iframe with Jquery? Any idea on how to automatically resize the height of an iframe based on its content. 

The iframe source is coming from different domain. 

Any thoughts on how to achieved it via Jquery or native JS? 

Thanks

UPDATE: 
This script addressed my needs.

Drupal.behaviors.cnngomobile = function (context) {
    $(window).bind('load', function(){          
        var adsIframe = document.getElementById("303799");
        if (adsIframe) {
          var style = adsIframe.contentWindow.document.createElement("link");
          // create &lt;link&gt;
          var host = "http://"+location.host+"/sites/all/themes/cnngomobile/css/style-iframe.css";
          style.setAttribute("href", host);
          style.setAttribute("rel", "stylesheet");
          style.setAttribute("type", "text/css");
          // append
          adsIframe.contentWindow.document.head.appendChild(style);
        }
    });
  };
I have implemented automatic iframe resizing using the cross-domain messaging ability of HTML5's window.postMessage() API.  Required reading: http://davidwalsh.name/window-postmessage, http://drupal.org/node/756722.

Example:

// "Sending" side (iframe)
Drupal.behaviors.yourIframeUpdateBehavior = {}
Drupal.behaviors.yourIframeUpdateBehavior.attach(context, settings) = {
  var data = {
    'bodyWidth':jQuery('body').width(),
    'bodyHeight':jQuery('body').height()
  }
  var domain = '*'; // Send to any domain.

  // Send current document dimensions to any parent of iframe
  parent.postMessage(data, domain);

  return false;
}

// "Receiving" side (iframe parent)
&lt;script type="text/javascript"&gt;// &lt;![CDATA[
$(document).ready(function() {
  $(window).bind('message', function(event) {
    var frameWidthPx = event.originalEvent.data.bodyWidth+'px';
    var frameHeightPx = event.originalEvent.data.bodyHeight+'px';
    $("#frame_id").width(frameWidthPx);
    $("#frame_id").height(frameHeightPx);
  });
});
// ]]&gt;&lt;/script&gt;