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

Javascript
JavaScript脚本:在网页中绘制图表
Jquery在实用和易学使用上的特点
网页制作之Javascript代码技巧
利用Java程序把Word文档转换成Html文件
提供gif icon制作的几个站点
JavaScript 实现 Konami Code
实用Javascript Tab导航插件23个
掌握JavaScript语言的思想前提
可以制作动画菜单效果的jquery插件
从脚本编程的角度看JSP的安全
JavaScript教程:伸缩菜单的制作
Javascript 代码也可以变得优美
与JavaScript新人共同分享实用经验
远程控制顺畅无阻碍-java来实现
Java开源的高性能缓存框架
通过代理访问因特网上的Web服务器
JavaScript基础教程:调试及应用
通过SSH交互进行Java应用开发
Java API编写自己的NamespaceContext
Java编程教程:SecureJSH特性简介

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


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