跨域下iframe自适应高度_html/css_WEB-ITnose
程序员文章站
2022-05-12 17:09:10
...
最近在做一个需求,需求大致背景:页面中iframe嵌入另一家公司的列表页
博主的第一反应就是“very easy!”,so,挽起双袖开始敲代码
结果出现问题了,iframe跨域,无法获得内嵌页面的高度,因此出现的上下滚动条,so难看!
于是上网找大神,皇天不负有心人啊,终于找到了,激动之情无以言表....
故事背景交代完毕
/******************************华丽的分割线,哈哈****************************/
大神的例子大致是这样的:
假设www.a.com下的一个页面a.html要包含www.b.com下的一个页面c.html。
我们使用www.a.com下的另一个页面agent.html来做代理,通过它获取iframe页面的高度,并设定iframe元素的高度
a.html中包含iframe:
1
在c.html中加入如下代码:
1 2
最后,agent.html中放入一段js:
1
agent.html从URL中获得宽度值和高度值,并设置iframe的高度和宽度(因为agent.html在www.a.com下,所以操作a.html时不受JavaScript的同源限制)
文章引用:前端开发博客
推荐阅读
-
iframe高度自适应内容_html/css_WEB-ITnose
-
iframe跨域高度自适应_html/css_WEB-ITnose
-
iframe自适应高度_html/css_WEB-ITnose
-
iframe自适应高度_html/css_WEB-ITnose
-
iframe自适应内容高度,动态变高变低_html/css_WEB-ITnose
-
iframe自适应内容高度,动态变高变低_html/css_WEB-ITnose
-
iframe框架自适应高度问题_html/css_WEB-ITnose
-
通过Iframe在A网站页面内嵌入空白页面的方式,跨域获取B网站的数据返回给A网站!_html/css_WEB-ITnose
-
兼容firefox的iframe高度自适应代码_html/css_WEB-ITnose
-
html之小积累-.-iframe自适应高度_html/css_WEB-ITnose