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

iframe高度自适应的一个方法

葱子9年前 (2017-09-20)网站运营1888

最近在写网页的时候,遇到一个问题,需要在某个页面下调用另外一个页面做内容展现。 第一想到的就是使用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

相关文章

解决:无法在应用程序配置中找到 scriptProcessor

解决:无法在应用程序配置中找到 scriptProcessor

最近在帮某个站长配置服务器的过程中遇到这个问题,记录一下: HTTP 错误 500.0 - Internal Server Error 无法在应用程序配置中找到 scriptProcessor 问题主要是出在web.con...

解决WordPress代码单双引号输出为中文全角字符的问题

6月份对葱子博客更换了现在的这款主题,这段时间由于比较忙,所以对新主题这块没有详细的做测试。 导致出现了部分问题,其中之一的问题就是文章页中的单双引号在复制后都变成了中文全角字符。 这个问题在平时...

详解WDCP3.2.8自动配置HTTPS功能

详解WDCP3.2.8自动配置HTTPS功能

wdcp最新版3.2.8已经支持在后台直接配置HTTPS了,不过很多站长似乎不太会使用这个功能。 下面我就简单的给大家讲解下如何使用这个功能: 一、新建网站 在wdcp...

网站换模板影响收录排名吗

在站长论坛看到有人问网站换模板会不会影响收录排名的问题,很多没有回答到点子上。 会不会影响收录排名:会。 为什么会影响:不建议频繁更新网站前端模板,因为搜索引擎抓取的内容就是你前端网页所呈现的内容。你的网站模板一直未变化,对于搜索引擎来...

你的服务器还在裸奔?做好这6点,服务器才算安全了!

你的服务器还在裸奔?做好这6点,服务器才算安全了!

近期葱子接到很多站长的求助,服务器被黑,网站被挂马,快照被劫持等等。 在这里,葱子给大家讲下加强服务器和网站安全的方法。 一、关闭不常用的服务器端口 1、我们常用的端口一般有:FTP-21、SSH(22)、远程桌面(3389)、h...

常用云服务器主机管理面板推荐

常用云服务器主机管理面板推荐

在之前【对于新建discuz网站的一些建议:X3.4、服务器、HTTPS】这篇文章中,葱子我给大家讲过在新建站点时尽量使用云服务器,同时可以通过使用服务器面板来管理云服务器,实现可视化操作。 下面葱子给大家介绍一下云服务器的一些使用指南。...

发表评论

访客

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