iframe自适应高度_iframe根据内容自适应高度

iframe自适应高度_iframe根据内容自适应高度1、iframe自适应页面高度   首先需要给iframe设置一个id,不需要滚动条则加上scrolling=”no”   然后加上一个onload事件functioniFrameHeight(iframe){ varifm=document.getElementById(iframe.id); varsubWeb=document.frames

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

1、iframe自适应页面高度

      首先需要给iframe设置一个id,不需要滚动条则加上scrolling=”no”

      然后加上一个onload事件

function iFrameHeight(iframe) {   
	var ifm= document.getElementById(iframe.id);   
	var subWeb = document.frames ? document.frames[iframe.id].document : ifm.contentDocument;   
	if(ifm != null && subWeb != null) {
	   ifm.height = subWeb.body.scrollHeight;
	   ifm.width = subWeb.body.scrollWidth;
	}   
} 

<iframe src=' ' width='100%'  id="compInfo" frameborder='0'scrolling="no"  οnlοad="iFrameHeight(this)"></iframe>

2、若需要iframe固定一个高度,超过这个高度才自适应

function iFrameHeightContact(iframe) {   
	var ifm= document.getElementById(iframe.id);   
	var subWeb = document.frames ? document.frames[iframe.id].document : ifm.contentDocument;   
	if(ifm != null && subWeb != null) {
		var ifmHeight = subWeb.body.scrollHeight;
		var ifmWidth = subWeb.body.scrollWidth;
		if(ifmHeight<400){
			ifm.height = 400;
			ifm.width = ifmWidth;
		} else {
			ifm.height = ifmHeight;
			ifm.width = ifmWidth;
		}
	   
	}   
} 

<iframe src=' ' width='100%'  id="compInfo" frameborder='0'scrolling="no"  οnlοad="iFrameHeight(this)"></iframe>

* 400则为你想要固定的高度


版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/182877.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 红胖子网络科技博文大全:开发技术集合(包含Qt实用技术、树莓派、三维、OpenCV、OpenGL、ffmpeg、OSG、单片机、软硬结合等等)持续更新中…[通俗易懂]

    红胖子网络科技博文大全:开发技术集合(包含Qt实用技术、树莓派、三维、OpenCV、OpenGL、ffmpeg、OSG、单片机、软硬结合等等)持续更新中…[通俗易懂]各位读者,知识无穷而人力有穷,所以,要么改需求,要么找专业人士,要么自己研究。大家可以点赞、收藏、关注、评论我啦、需要完整文件随时联系我或交流哟~!

    2022年6月29日
    29
  • python写一个完整的小程序_写一个python小程序[通俗易懂]

    python写一个完整的小程序_写一个python小程序[通俗易懂]在windows环境下进行操作window+R输入cmd创建一个文件夹mkdirpytxt创建一个py文件py.py用notepad或者记事本等工具进行编辑或首先声明python3.5以后没有中文乱码,已经支持中文,就像java的jdk1.6以后都支持中文一样。进入python交互环境下然后可以进行数据运算,下面命令是简单的加、减、乘、除下面看一下python2.0版本的中文运行P…

    2022年6月18日
    32
  • linux下安装svn客户端_服务器安装步骤

    linux下安装svn客户端_服务器安装步骤1、简介Subversion是优秀的版本控制工具,其具体的的优点和详细介绍,这里就不再多说.首先来下载和搭建SVN服务器。yuminstallsubversion2、配置2.1、创建仓库我们这里在/home下建立一个名为svn的仓库(repository),以后所有代码都放在这个下面,创建成功后在svn下面多了几个文件夹。#cd/home#mkdirsvn#svnadmincreate/home/svn#lssvnconfdb.

    2022年8月31日
    9
  • IT公司速查手册–IT公司红黑榜

    IT公司速查手册–IT公司红黑榜IT公司速查手册–IT公司红黑榜http://www.bewww.net/index.html今天看到bewww.net原来有红黑榜,好像以前上去的时候还没有这个的。找工作的兄弟们要多留个心眼了,可疑的公司要先上网上查下,防止受骗~~~~黑榜上有不少挺熟悉的公司,好像我还投过简历的也有~~~ 

    2022年7月16日
    14
  • linux怎么查看环境变量配置_配置完环境变量要重启吗

    linux怎么查看环境变量配置_配置完环境变量要重启吗1.查看当前系统定义的所有环境变量使用export命令可查看当前系统定义的所有环境变量2.输出单个环境变量的值echo$ENV可查看单个环境变量的值,如查看PATH环境变量的值其中PATH变量定义了运行命令的查找路径,以冒号:分割不同的路径。…

    2022年9月30日
    2
  • golang高性能日志库zap的使用

    golang高性能日志库zap的使用本文作者 陈进坚个人博客 https jian1098 github ioCSDN 博客 https blog csdn net c jian 简书 https www jianshu com u 8ba9ac5706b6 联系方式 摘要 zap 是 Uber 开发的非常快的 结构化的 分日志级别的 Go 日志库 根据 Uber goZap 的文档 它的性能比类似的结构化日志包更好 也比标准库更快 具体的性能测试可以去 github 上看到 github 地址 https

    2025年12月11日
    4

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号