Monday, August 10, 2009

iFrame automatically resize height by cross domain

After trying lots of solutions from internet. Here follows my verified solution successfully.
There are totally 3 relevant files involoved.
  1. The main aspx file ( which hosting iframe of another site. (Under domain main.com) Notice: you should add src="http://sub.com/index.jsp" in the iframe.
  2. The transmission html file (grAutoSize.htm) which link the iframe part with main site. (Under domain main.com)
  3. The hosting site JS file (refer.js) which referred by sub domain pages (Under domain sub.com). It could be different tech platform such as JSP/PHP/ASP. Here is index.jsp.
    Notice: the variable urlC should be main.com/grAutoSize.htm.
  4. You don't need add document.domain = xxx.com for this solution. Also it was tested to working with IE7, IE8, Mozilla Firefox 3, Google Chrome 2, Safari 4.