当前位置: 首页 > 图文教程 > 网络编程 > Javascript > iframe src为图片时的高度自适应的代码

Javascript
仿校内登陆框,精美,给那些很厉害但是没有设计天才的程序员
javascript call和apply方法
createElement动态创建HTML对象脚本代码
javascript getElementById 使用方法及用法
javascript脚本调试方法小结
Document和Document.all区别分析
Javascript 对象的解释
javascript 随意拖动的小方块特效
Javascript 陷阱 window全局对象
Javascript hasOwnProperty 方法 & in 关键字
Javascript 构造函数 实例分析
javascript replace()方法的简单分析
javascript 尚未实现错误解决办法
js 对象外部访问或者调用问题
JavaScript模拟下拉菜单代码
js获取鼠标位置杂谈附多浏览器兼容代码
JS获得鼠标位置(兼容多浏览器ie,firefox)IT学习网修正版
JS 自动安装exe程序
javascript 动态添加事件代码
Js callBack 返回前一页的js方法

Javascript 中的 iframe src为图片时的高度自适应的代码


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 367 ::
收藏到网摘: n/a

对于iframe高度自适应的问题,网上已经被讨论n次了,一般通过在iframe加载完毕时访问iframe内页body的offsetHeight和offsetWidth然后更新iframe的高宽来实现。
今日遇到的自适应问题与以往有一些不同,这次的src是一张图片,而且是一张大小不确定的图片(从数据库取出来的数据生成的),在此使用以往的方式似乎就没有那么灵验了。突然想到img标记的高宽是可以获取到的。于是突然有了思路。
解决办法如下:
先动态生成一个img元素,在iframe页面加载完成时(onload)将其src赋给img标记,然后获取该img的高宽,再动态修改iframe高宽即可,同时不要忘了设定iframe页面body的margin和padding为0,否则会由于padding和margin默认不为0的缘故导致出现滚动条。
点击运行可以看到效果:
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]