当前位置:首页 > 网站运营 > 正文内容

iframe高度自适应的一个方法

葱子8年前 (2017-09-20)网站运营1583

最近在写网页的时候,遇到一个问题,需要在某个页面下调用另外一个页面做内容展现。 第一想到的就是使用iframe框架来实现。 有个问题就是,目标页面的高度是动态调整的,非固定的。 在网上搜索了下,找个一个不错的解决方法,使用js来实现,具体实现代码如下:

1、js代码:


<script>function setIframeHeight(iframe) { if (iframe) { var iframeWin = iframe.contentWindow || iframe.contentDocument.parentWindow; if (iframeWin.document.body) { iframe.height = iframeWin.document.documentElement.scrollHeight || iframeWin.document.body.scrollHeight; } } }; window.onload = function () { setIframeHeight(document.getElementById('external-frame')); };</script>  


2、html代码如下:

<iframe src="backtop.html" frameborder="0" scrolling="no" id="external-frame" onload="setIframeHeight(this)"></iframe>
以上代码参考这篇文章,这篇文章里同时提到了其他几个方法,感兴趣的可以看下。 http://caibaojian.com/iframe-adjust-content-height.html

扫描二维码推送至手机访问。

版权声明:本文由葱子博客发布,如需转载请注明出处。

本文链接:https://www.aitiancheng.com/article-1362.html

相关文章

寂寞河社区完成https改造 顺利通过百度站长https认证

寂寞河社区完成https改造 顺利通过百度站长https认证

寂寞河社区是我的一个客户的运营项目,主要是图片交流社区。 客户的需求主要有几点: 1、服务器环境配置: discuz是基于php的应用,所以需要配置php的运行环境。 在这次配置中,我采用了IIS+PHP5....

小云APP 修改Android包名(packagname)教程!

小云APP 修改Android包名(packagname)教程!

修改包名 (packagname) 将会导致:客户端的分享、支付、第三方登录、应用市场更新 等功能出现问题。如非新建应用,绝不推荐使用该功能。 修改包名要用到证书(keystore),制作证书的方法有很多,下面介绍我所知...

【干货】百度搜索对HTTPS站点全流程支持方案【转载】

【干货】百度搜索对HTTPS站点全流程支持方案【转载】

5月25日,VIP大讲堂用3个小时的时间给大家介绍网站HTTPS改造方案等内容,那么百度搜索对HTTPS站点的支持到底怎样了吗?让我们赶紧看看搜索工程师是怎么说的。...

windows server2008服务器安装一键php环境包

windows server2008服务器安装一键php环境包

最近在阿里云购买了一台Windows server2008的ECS服务器,准备在这上面安装一个php环境来运行discuz网站。 windows系统下,一般是使用IIS(7.0/7.5)作为web服务器。 所以为了安装php环境包...

案例分享:网站被植入projectpoi挖矿脚本导致CPU100%的解决办法

案例分享:网站被植入projectpoi挖矿脚本导致CPU100%的解决办法

最近在帮北安味道的站长排查他网站的问题:访问他网站后,浏览网站的电脑CPU使用将达到100%。   猜想应该是网页上被植入了恶意的js文件。 通过使用F12排查异常js文件发现,有个叫做projectpoi.m...

亲测有效!2段代码轻松禁止百度转码

亲测有效!2段代码轻松禁止百度转码

不知道各位站长是否有在手机中百度过自己的网站,当你从搜索结果中打开自己网站的时候,是否有发现网站页面似乎和自己本身的界面有点出入? 拉到文章末尾,你会发现一条百度转码声明。 什么是百度转码 百度会将部分未适配移...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。