經常會有父頁面需要通過iframe嵌入另一個子頁面,又要適時根據子頁面的高度調整父頁面中iframe的高度,這就要求 頁面必須具有自適應功能。自適應思想比較簡單:就是父頁面中iframe高度必須要適時根據子頁面 高度進行調整。 由于涉及到js操作,因此對于不同域名的自適應解決方案有所不同,主要是在解決跨域問題。
對于同父級域名下的自適應高度:www.chinaz.com/index.html 頁面中嵌入www.chinaz.com/xxx.html頁面

1.0 http://jipiao.taobao.com/index.htm中關鍵代碼
| <iframe id="J_selfAdapting" src=http://www.chinaz.com/Design/Rules/"http://www.chinaz.com/xxx.htm" mce_src="http://www.chinaz.com/xxx.htm" frameborder="0" scrolling="no" style="height:0;"></iframe> |
頁面增加如下JS:
| <mce:script type="text/javascript"><!-- (function(){ /** * 獲取當前域 **/ function _getDomain(){ var _hostname = window.location.hostname.toString(); var _hosts = _hostname.split("."); var _len = _hosts.length; if(_len>2){ return _hosts[_len-2]+"."+_hosts[_len-1]; } return _hostname; } document.domain = _getDomain(); })(); // --></mce:script> |
編輯整理