jQuery简单实现iframe的高度根据页面内容自适应的方法(转)

本文实例讲述了jQuery简单实现iframe的高度根据页面内容自适应的方法。分享给大家供大家参考,具体如下:

方式1:

//注意:下面的代码是放在和iframe同一个页面中调用

$("#iframeId").load(function () {

    var mainheight = $(this).contents().find("body").height() + 30;

    $(this).height(mainheight);

});


方式2:

//注意:下面的代码是放在iframe引用的子页面中调用

$(window.parent.document).find("#iframeId").load(function () {

    var main = $(window.parent.document).find("#iframeId");

    var thisheight = $(document).height() + 30;

    main.height(thisheight);

})

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 自适应高度,其实就是设置iframe的高度,使其等于内嵌网页的高度,从而看不出来滚动条和嵌套痕迹。对于用户体验和网...
    布拉德皮蛋_qzy阅读 8,660评论 0 3
  • 一:认识jquery jquery是javascript的类库,具有轻量级,完善的文档,丰富的插件支持,完善的Aj...
    xuguibin阅读 5,626评论 1 7
  • 最近在做pc端项目的时候由于某些原因吧用了很少接触的iframe;虽然知道很多坑,但是由于项目需要所以没有办法的使...
    小_花花哟阅读 3,733评论 1 0
  • Attribute: $("p").addClass(css中定义的样式类型); 给某个元素添加样式 $("img...
    扑克脸_457e阅读 3,644评论 0 1
  • 我是黑夜里大雨纷飞的人啊 1 “又到一年六月,有人笑有人哭,有人欢乐有人忧愁,有人惊喜有人失落,有的觉得收获满满有...
    陌忘宇阅读 12,718评论 28 53