乐鱼足球体育_乐鱼(中国)

乐鱼足球体育_乐鱼(中国)

全国热线:400-660-5510广州:020-22265510深圳:0755-23915687上海:021-32265355
site topic网站专题
乐鱼足球体育_乐鱼(中国)
>
网站专题
>
专题详情
分享新闻到:

iframe框架页面实现自适应高度解决方案

乐鱼足球体育_乐鱼(中国) :2010-01-06 09:42     阅读数:       标签:

经常会有父页面需要通过iframe嵌入另一个子页面,又要适时根据子页面的高度调整父页面中iframe的高度,这就要求 页面必须具有自适应功能。自适应思想比较简单:就是父页面中iframe高度必须要适时根据子页面 高度进行调整。 由于涉及到js操作,因此对于不同域名的自适应解决方案有所不同,主要是在解决跨域问题。

对于同父级域名下的自适应高度:www.chinaz.com/index.html 页面中嵌入www.chinaz.com/xxx.html页面

 

1.0   //jipiao.taobao.com/index.htm中关键代码

<iframe id="J_selfAdapting" src=//www.chinaz.com/Design/Rules/"//www.chinaz.com/xxx.htm" mce_src="//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>

编辑整理