iframe的高度自适应

最新推荐文章于 2023-03-27 14:55:40 发布
最新推荐文章于 2023-03-27 14:55:40 发布
阅读量74 收藏
点赞数
原文链接：http://www.cnblogs.com/is1988/archive/2012/07/04/2575839.html
版权 
<script>
function SetWinHeight(obj) {
    var win = obj;
    if (document.getElementById) {
        if (win && !window.opera) {
            if (win.contentDocument&& win.contentDocument.body.offsetHeight)
                win.height = win.contentDocument.body.offsetHeight;
            else if (win.Document && win.Document.body.scrollHeight)
                win.height = win.Document.body.scrollHeight;
        }
    }
}
</script>

上面是iframe高度自适应的js代码，把它插入到自己写的iframe标签的οnlοad=" "属性中即可（推荐js写到<head>标签内部）。

html如下：

<div>
<iframe src="http://192.168.3.91:8080/cobo/portal/comment.ptview" scrolling="no" frameborder="0" 
    width="100%" height="100%" onload="Javascript:SetWinHeight(this)">
</iframe>
</div>

<!-- 顺带写上jsp动态include引入页面和传参的方式 -->
<jsp:include page="showCommentPortal.jsp">
    <jsp:param name="infoLinkId" value="<%=infoLink.getInfoLinkId()%>" />
    <jsp:param name="infoSortId" value="<%=infoSort.getInfoSortId()%>" />
</jsp:include>

转载于:https://www.cnblogs.com/is1988/archive/2012/07/04/2575839.html

aaa9736
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
iframe高度自适应解决方式
lavendersue的博客
11-26 1441
带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能，可是 iframe的大小却不像层那样可以“伸缩自如”，所以带来了使用上的麻烦，给iframe设置高度的时候多了也不好，少了更是不行，现在，让我来告诉大 家几种iframe动态调整高度的方法。 1、 <iframe width="778" align="center" height="200" id=...
html iframe自动高度,真正解决iframe高度自适应问题
weixin_33826994的博客
06-02 3969
1.前言解决iframe高度自适应问题有两种方法1.pym2.手动设置iframe的高度本文主要是总结第二种实现方式，因为第一种pym.js插件我没用懂如果使用iframe时，遇到以下的需求：iframe的高度始终等于嵌入页面内容的高度，而不是屏幕的高度右侧不允许出现两个滚动条iframe的高度自适应不仅仅是指刚加载进来时，也有可能嵌入内容的高度会随点击变化(如：下拉菜单，左侧导航栏等)页面可能同...
解决iframe高度自适应
weixin_44111803的博客
03-21 7462
解决iframe高度自适应原因第一种方法第二种方法 原因 iframe的高度不会随着页面高度的变化而变化，可能会导致页面显示不全，或者页面下方有空白的问题。 第一种方法 这个方式更适用于嵌套的页面，当嵌套多个iframe时，比如左侧有个侧边栏，右侧是个大的iframe，这个大的iframe又嵌套了一层：中间是iframe，但是右侧又有个侧边栏，这时候不想让iframe单独滑动（避免页面出现两个滚动条），而是想整个页面一起滑动时，用这个方法。 html代码： 注意一定要写height=‘100%’ scrol
vue iframe高度自适应
郑小let的博客
08-23 3375
我们在开发过程中会遇到iframe嵌入外部页面问题，通常外部页面高度不一，如果我们写死iframe高度，就会出现滚动条。通过以下设置会避免滚动条情况。
iframe 高度自适应问题
moamao_jishuyuan的博客
02-09 927
需求介绍: 项目里要往web页面埋 facebook 的投稿，接口返回资源 如下： <iframe id="hankyumensosaka" src="https://www.facebook.com/plugins/post.php?width=350&href=https://www.facebook.com/306922136507980/posts/327540447779482" width="350" height="500" style="border:none; ove
iframe高度自适应
weixin_46122878的博客
03-27 199
iframe高度自适应
vue iframe高度自适应 实用
web_xiaolei的博客
02-20 5934
iframe是vue的，在使用过程中高度根据数据实时变化，不好设置iframe的高度值。试了多种方式之后，总结了几种自适应的方式。 实时刷新iframe高度变化 var iframes = document.getElementsByTagName('iframe'); setInterval(function() { for (var i = 0, j = iframes.length; i < j; ++i) { iframes[i].setAttribute('heigh
iframe 高度自适应的方法
我的专栏
06-15 1365
页面中使用iframe嵌套其他页面，如果出现滚动条，确实不好看，如果想不滚动就得让 iframe 高度自适应。 以下代码可以实现获取嵌套body的高度： 或者可以使用scrollHeight属性获取指定区域的高度、宽度 scrollHeight 属性是一个只读属性，它返回该元素的像素高度，高度包含内边距（padding），不包含外边距（margin）、边框（border），是一个整数，单位是像素 px。...
iframe高度自适应的解决方案
baidu_41604826的博客
05-26 3369
iframe高度自适应的解决方案 使用场景：通过Iframe来解决项目嵌套问题时会碰到iframe的高度自适应的问题； 正常情况下的iframe：会出现一个滚动条影响美观 情况1：不存在跨域情况时的解决方案 <iframe name="outerPage" onload="iframeload()" src="./test.html" name="myFrame" scrolling="auto" frameborder="0" id="outerPage" :style="{ 'min-
js html高度自适应,js实现高度iframe高度自适应的4种方法【亲测有效】
weixin_33817338的博客
06-23 1333
摘要：使用iframe放置嵌套页面如虽然可以通过css来设置固定高度，但如果页面的高度不能确定或者高度会变化在用css来设置高度就有点不太方便了，如果能够让iframe的高度自适应的话就可以不用担心这个问题了。 使用 iframe 放置嵌套页面如虽然可以通过 css 来设置固定高度，但如果页面的高度不能确定或者高度会变化在用 css 来设置高度就有点不太方便了，如果能够让 iframe 的高...
jQuery解决iframe高度自适应代码
10-29
在本例中，通过获取iframe内容的scrollHeight属性，可以获取到内容的实际高度，然后用这个高度来设置iframe的高度，实现高度自适应。 知识点六：跨浏览器兼容性 在实际开发中，需要考虑不同浏览器的兼容性问题。在...
js实现iframe自动自适应高度的方法
10-24
console.error("无法调整Iframe高度，可能因跨域限制", e); } } ``` 这个函数通过`window.frameElement`获取当前运行脚本的Iframe元素，然后设置它的`height`属性为`document.body.scrollHeight`，即文档内容的...
Iframe 高度自适应浏览器高度
03-28
这种技术常被用来实现...以上就是关于“Iframe高度自适应浏览器高度”的主要知识点，实践中可能需要结合具体场景和需求选择合适的方法。在实际应用中，还要考虑到兼容性问题，确保在不同浏览器和设备上都能正常工作。
嵌入式系统开发：深入理解信号机制及其在进程通信中的应用
08-24
这篇文件是一份关于嵌入式系统中信号机制的详细介绍，它不仅涵盖了信号的基本概念和特性，还深入探讨了信号的基本操作和应用场景。信号是软件中断的一种模拟，它允许异步进程中断正在运行的进程，以处理突发事件。这种机制对于嵌入式系统尤为重要，因为它可以确保系统对外部事件做出快速响应。 文档首先解释了信号的异步通信特性，即进程无需等待信号的到来，也无法预知信号何时到达。接着，它详细介绍了信号的命名规则和如何在Linux系统中查看信号与数字编码的对应关系。例如，使用命令kill -l可以列出所有信号及其对应的数字编码。 进一步，文档列举了产生信号的几种情况，包括用户操作、硬件异常、软件异常、调用kill函数和运行kill命令。每种情况下，文档都提供了详细的解释和示例，帮助读者理解信号是如何在不同情境下产生的。 文档还介绍了进程收到信号后的几种处理方式：忽略信号、执行系统默认动作或自定义信号处理函数。特别强调了SIGKILL和SIGSTOP信号不能被忽略，因为它们提供了一种可靠的进程终止方法。
资源androidioswinOpenOpenCV3.4.7
08-24
资源androidioswinOpenOpenCV3.4.7提取方式是百度网盘分享地址
java源码资源学生成绩系统(图形界面)
08-24
java源码资源学生成绩系统（图形界面）提取方式是百度网盘分享地址
资源OpenCV3视频分析跟踪对象指导视频+文档+源码
最新发布
08-24
资源OpenCV3视频分析跟踪对象指导视频+文档+源码资源大小2G提取方式是百度网盘分享地址
Autodesk Vault.zip
08-24
Autodesk Vault.zip
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值