iframe src为图片时的高度自适应的代码
更新时间:2007年10月29日 20:42:16 作者:
对于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 全选 注:引入外部Js需再刷新一下页面才能执行]
今日遇到的自适应问题与以往有一些不同,这次的src是一张图片,而且是一张大小不确定的图片(从数据库取出来的数据生成的),在此使用以往的方式似乎就没有那么灵验了。突然想到img标记的高宽是可以获取到的。于是突然有了思路。
解决办法如下:
先动态生成一个img元素,在iframe页面加载完成时(onload)将其src赋给img标记,然后获取该img的高宽,再动态修改iframe高宽即可,同时不要忘了设定iframe页面body的margin和padding为0,否则会由于padding和margin默认不为0的缘故导致出现滚动条。
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
相关文章
教你JavaScript利用charAt()统计出现次数最多的字符和次数
这篇文章主要介绍了JavaScript利用charAt()统计出现次数最多的字符和次数的操作方法,本文以判断一个字符串'aabcdobdackoppz'中出现次数最多的字符,并统计其次数为例,通过实例代码给大家详细介绍,需要的朋友参考下吧2021-08-08getElementByIdx_x js自定义getElementById函数
最近看JS代码,发现不少人问getElementByIdx_x是什么函数,其实就是个getElementById自定义函数2012-01-01Bootstrap富文本组件wysiwyg数据保存到mysql的方法
这篇文章主要为大家详细介绍了Bootstrap富文本组件wysiwyg数据保存到mysql的方法,感兴趣的小伙伴们可以参考一下2016-05-05
最新评论