iframe高度自适应方法
<iframe width="100%" id="tbbrecommend" name="tbbrecommend" src="test.php" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe>
// 计算页面的实际高度,iframe自适应会用到
function calcPageHeight(doc) {
var cHeight = Math.max(doc.body.clientHeight, doc.documentElement.clientHeight)
var sHeight = Math.max(doc.body.scrollHeight, doc.documentElement.scrollHeight)
var height = Math.max(cHeight, sHeight)
return height
}
var ifr = document.getElementById('tbbrecommend')
ifr.onload = function() {
var iDoc = ifr.contentDocument || ifr.document
var height = calcPageHeight(iDoc)
ifr.style.height = height + 'px'
}
以上方法在pc测试没有问题,但是在手机浏览器删查看则没有效果
iframe高度自适应方法的更多相关文章
- iframe高度自适应方法大全
http://www.3tii.com/993.html http://caibaojian.com/iframe-adjust-content-height.html http://www.jb51 ...
- 谷歌、火狐浏览器下实现JS跨域iframe高度自适应的完美解决方法,跨域调用JS不再是难题!
谷歌.火狐浏览器下实现JS跨域iframe高度自适应的解决方法 导读:今天开发的时候遇到个iframe自适应高度的问题,相信大家对这个不陌生,但是一般我们都是在同一个项目使用iframe嵌套页面,这个 ...
- iframe高度自适应的6个方法
原文链接:http://caibaojian.com/iframe-adjust-content-height.html JS自适应高度,其实就是设置iframe的高度,使其等于内嵌网页的高度,从而看 ...
- iframe高度自适应的方法
第一种:iframe内容未知,高度可预测 这个时候,我们可以给它添加一个默认的CSS的min-height值,然后同时使用JavaScript改变高度.常用的兼容代码有: // document.do ...
- iframe高度自适应(同域)
今天解决了iframe高度自适应的问题,不过这只是同域下的页面嵌入,以下是代码: function SetCwinHeight(){ var iframeid = document.getElemen ...
- jQuery解决iframe高度自适应代码
网上查了好多用着都不行,自己搞定了:在包含iframe的页面中加入以下脚本,基本思想是在iframe加载内容后重新设置高度,下面代码尽在IE6中用过,没在其他浏览器中测试. 代码如下: <scr ...
- iframe高度自适应
前两天在网上看到了一道面试题,问iframe高度自适应的问题.发现自己之前几乎没有关注过iframe的问题,所以在这里记录一下. 原题目是: 页面A的域名是:http://www.taobao.com ...
- iframe高度自适应内容
JS自适应高度,其实就是设置iframe的高度,使其等于内嵌网页的高度,从而看不出来滚动条和嵌套痕迹.对于用户体验和网站美观起着重要作用. 如果内容是固定的,那么我们可以通过CSS来给它直接定义一个高 ...
- 完美实现跨域Iframe高度自适应【Iframe跨域高度自适应解决方案】
Iframe的强大功能偶就不多说了,它不但被开发人员经常运用,而且黑客们也常常使用它,总之用过的人知道它的强大之处,但是Iframe有个致命的“BUG”就是iframe的高度无法自动适应,这一点让很多 ...
随机推荐
- 连接mongodb服务器
连接mongodb有几种方法 一种是使用mongodb编译时生成的客户端进行连接,就是我们之前介绍过的mongo客户端 另一种是使用各种驱动进行连接 这次使用mongo客户端进行连接,之前我们启动了一 ...
- Week08_day01 (Hive开窗函数 row_number()的使用 (求出所有薪水前两名的部门))
数据准备: 7369,SMITH,CLERK,7902,1980-12-17,800,null,20 7499,ALLEN,SALESMAN,7698,1981-02-20,1600,300,30 7 ...
- MySQL之InnoDB索引面试学习笔记
写在前面 想要做好后台开发,终究是绕不过索引这一关的.先问自己一个问题,InnoDB为什么选择B+树作为默认索引结构.本文主要参考MySQL索引背后的数据结构及算法原理和剖析Mysql的InnoDB索 ...
- 第一篇博客-MVC路由简述
一直念叨着写博客,可是迟迟不见下笔,工作到现在,技术长进了一点,但是记的东西都很杂,也没个思路,也不知道怎么去写一遍博客,现在在做MVC,写一点跟MVC有关的吧. 我们都知道MVC程序的所有请求都是先 ...
- 05_centos7安装python3
https://www.cnblogs.com/FZfangzheng/p/7588944.html https://www.cnblogs.com/simuhunluo/p/7704765.html ...
- 009_linuxC++之_友元函数
(一)定义:友元函数是指某些虽然不是类成员却能够访问类的所有成员的函数.类授予它的友元特别的访问权.通常同一个开发者会出于技术和非技术的原因,控制类的友元和成员函数(否则当你想更新你的类时,还要征得其 ...
- 02 | 日志系统:一条SQL更新语句是如何执行的?
前面我们系统了解了一个查询语句的执行流程,并介绍了执行过程中涉及的处理模块.相信你还记得,一条查询语句的执行过程一般是经过连接器.分析器.优化器.执行器等功能模块,最后到达存储引擎. 那么,一条更新语 ...
- 五十七.分布式ELK平台、ES安装 、 扩展插件 、Kibana安装
1. ES集群安装 准备1台虚拟机 部署elasticsearch第一个节点 访问9200端口查看是否安装成功 1ELK是日志分析平台,不是一款软件,而是一整套解决方案,是三个软件产品的首字母缩写 ...
- 蓝牙4.0模块,AT指令集
一,LED状态 二,蓝牙模块有两种通信模式 1,AT指令模式 2,数据透传模式 三.AT指令程序设计 1.设置模块的名字 void usart3_send_str(char *pbuf) { whil ...
- 第二章实战补充:Python操作Mysql
( 一) 导入pymysql 基础铺垫:pymysql与MySQLdb pymysql–支持py2.py3; MySQLdb–仅支持python3; django内部默认为MySQLdb,用Pytho ...