当前位置: 首页 > 编程笔记 >

教你用jquery实现iframe自适应高度

白芷阳
2023-03-14
本文向大家介绍教你用jquery实现iframe自适应高度,包括了教你用jquery实现iframe自适应高度的使用技巧和注意事项,需要的朋友参考一下

iframe代码,注意要写ID

<iframe src="test.html" id="main" width="700" height="300" frameborder="0" scrolling="auto"></iframe>

jquery代码一:

//注意:下面的代码是放在test.html调用 
$(window.parent.document).find("#main").load(function(){ 
var main = $(window.parent.document).find("#main"); 
var thisheight = $(document).height()+30; 
main.height(thisheight); 
});

jquery代码二:
//注意:下面的代码是放在和iframe同一个页面调用 
$("#main").load(function(){ 
var mainheight = $(this).contents().find("body").height()+30; 
$(this).height(mainheight); 
}); 

 类似资料:
  • 本文向大家介绍jquery实现textarea 高度自适应,包括了jquery实现textarea 高度自适应的使用技巧和注意事项,需要的朋友参考一下 之前给大家分享过用Javascript控制文本框textarea高度随内容自适应增长收缩,今天花了点时间换了种实现方法,总结一下 以上就是本文所述的全部内容了,希望对大家学习jQuery能够有所帮助。

  • 本文向大家介绍js实现iframe自动自适应高度的方法,包括了js实现iframe自动自适应高度的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了js实现iframe自动自适应高度的方法。分享给大家供大家参考。具体如下: 在编写网页的时候,很多时候要用到自动伸缩iframe高度 ,假如ifram中嵌入的是一个列表,那么增加数据后,刷新列表,iframe高度会自动伸长。删除数据后,ifr

  • 本文向大家介绍javascript原生和jquery库实现iframe自适应高度和宽度,包括了javascript原生和jquery库实现iframe自适应高度和宽度的使用技巧和注意事项,需要的朋友参考一下 javascript原生和jquery库实现iframe自适应内容高度和宽度---推荐使用jQuery的代码! 基于Jquery库的代码很好实现: ‍基于JS原生代码的实现: 只需在你被ifr

  • 本文向大家介绍JS实现iframe自适应高度的方法示例,包括了JS实现iframe自适应高度的方法示例的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了JS实现iframe自适应高度的方法。分享给大家供大家参考,具体如下: PS:高度自适应应用广泛,本站的很多在线工具也使用了这一技巧,列举如下几个工具供大家参考: JavaScript在线格式化工具(基于beautify.js插件): htt

  • 本文向大家介绍jQuery简单实现iframe的高度根据页面内容自适应的方法,包括了jQuery简单实现iframe的高度根据页面内容自适应的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了jQuery简单实现iframe的高度根据页面内容自适应的方法。分享给大家供大家参考,具体如下: 方式1: 方式2: 更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery操作ifr

  • 本文向大家介绍JS实现iframe自适应高度的方法(兼容IE与FireFox),包括了JS实现iframe自适应高度的方法(兼容IE与FireFox)的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了JS实现iframe自适应高度的方法。分享给大家供大家参考,具体如下: 之前一直被iframe自适应高度的问题困扰,很多JS代码在FF里面似乎就变成哑巴了。后来下面这段代码终于被我从万千号称兼容