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

Javascript
鼠标移动到一张图片时变为另一张图片
JS画图(非VML)--兼容IE/FF
基于prototype的validation.js发布2.3.4新版本,让你彻底脱离表单验证的烦恼
jQuery的一些注意
找到一点可怜的关于dojo资料,谢谢作者!
JS获取IUSR_机器名和IWAM_机器名帐号的密码
用js计算页面执行时间的函数
JS的IE和Firefox兼容性集锦
标准布局应用:对联与旗帜
XHTML-Strict 内允许出现的标签
自动生成文章摘要[JavaScript 版本]
飞鱼(shqlsl) javascript作品集
prototype 1.5相关知识及他人笔记
XP折叠菜单&仿QQ2006菜单
用Javascript轻松制作一套简单的抽奖系统
使用脚本控制网页Table的显示隐藏(全代码)_AX
Javascript代码混淆综合解决方案-Javascript在线混淆器
用 JavaScript 迁移目录
用简单的脚本实现一款漂亮的下拉菜单
建立完全独立的JS对象

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 306 ::
收藏到网摘: 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 全选 提示:你可先修改部分代码,再按运行]