繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > iframe src为图片时的高度自适应的代码
- Javascript
- 用jquery实现学校的校历(asp.net+jquery ui 1.72)
- 使用JQUERY Tabs插件宿主IFRAMES
- jquery 简短右键菜单 多浏览器兼容
- JQery 渐变图片导航效果代码 漂亮
- HTML node相关的一些资料整理
- JavaScript与DropDownList 区别分析
- 20个非常棒的Jquery实用工具 国外文章
- Firefox+FireBug使JQuery的学习更加轻松愉快
- firefox firebug中文入门教程 脚本之家新年特别版
- firefox插件Firebug的使用教程
- javascript addLoadEvent函数说明
- javascript getElementsByClassName 和js取地址栏参数
- 让firefox支持IE的一些方法的javascript扩展函数代码
- javascript 多种搜索引擎集成的页面实现代码
- Javascript 模拟点击事件(点击链接与html点击) 兼容IE/Firefox
- javascript 模拟点击广告
- javascript 精确获取样式属性（上）
- javascript 精确获取样式属性（下）
- javascript 精确获取页面元素的位置
- javascript 可控式透明特效实现代码
Javascript 中的 iframe src为图片时的高度自适应的代码
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-10-12 浏览: 179 ::
收藏到网摘: 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 全选 提示:你可先修改部分代码,再按运行]
[Ctrl+A 全选 提示:你可先修改部分代码,再按运行]
评论 (0) All
