亮点云

国家高新技术企业  一站式网站建设平台


藏亮点云建站网址


制作技巧

首页 >> 建站技巧 >>网站建设 >> 网站建设时如何让iframe在浏览器中自适应高度
详细内容

网站建设时如何让iframe在浏览器中自适应高度


企业网站建设时为什么需要使用iframe自适应高度呢?其实就是为了美观,要不然iframe和窗口长短大小不一,看起来总是不那么舒服,自适应高度对于用户体验度的提升尤为重要。网上关于iframe高度自适应的代码有很多,但比较杂乱,有一些过于复杂,有一些存在明显错误。缘由心生给出了一段修改后的精简版本,感觉不错,并简单修正了其中一处Opera下的错误。

iframe框架自适应高度首先设置样式:body{margin:0; padding:0;}如果不设置body的margin和padding为0的话,页面上下左右会出现空白。
html代码如下:<iframe src="https://www.371jianzhan.com" id="myiframe" scrolling="no" ="changeMyFrameHeight()"></iframe>js代码也得跟着改:function changeMyFrameHeight(){ var ifm= document.getElementById("iframepage"); ifm.height=document.documentElement.clientHeight;}window.onresize=function(){ changeMyFrameHeight(); }

window.onresize的作用就是当窗口大小改变的时候会触发这个事件。所以,建公司网站使用此方法可以完美的、真正的让iframe自适应高度了,试试看吧,并且兼容多种浏览器。



咨询热线:13683052803
微信咨询: ldv868
扫码联系客户经理
QQ 咨询: 302709883
公司地址: 北京市丰台区汇亚大厦306室
亮点传媒    版权所有     京ICP备2021039330号-7
Copyright @ 2018 . All rights reserved
 济南网站建设           智能服务终端           网站建设                                                                      
seo seo