iframe设置高度为100%
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<style>
* {
padding: 0;
margin: 0;
} html,
body {
width: 100%;
height: 100%;
overflow: hidden;
}
</style>
</head> <body>
<iframe id="ajk" width="100%" height="100%" src="http://dulijingjiren18.anjuke.com/gongsi-jjr-3435066/com161133/#afilters" frameborder="0"></iframe>
<script>
var ajk = document.querySelector('#ajk');
var screenHeight, scrillWidth; window.onresize = function() {
screenHeight = document.body.clientHeight;
scrillWidth = document.body.clientWidth;
ajk.height = screenHeight;
if (scrillWidth <= 768) {
ajk.src = "https://m.anjuke.com/hz/jjr-3435066/com161133/"
} else {
ajk.src = "http://dulijingjiren18.anjuke.com/gongsi-jjr-3435066/com161133/#afilters"
}
}
</script>
</body> </html>
当屏幕为手机屏幕时切换url,pc端时让网页100%显示
iframe设置高度为100%的更多相关文章
- js实现iframe自适应高度
转自:http://www.jb51.net/article/15780.htm 对于自适应高度的代码有很多,可效率什么的考虑进来好代码就不多见了,不过思路倒是差不多的! 不带边框的iframe因为能 ...
- iframe自适应高度的多种方法小结
转自:http://www.jb51.net/article/15780.htm 不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 iframe的大小 ...
- iframe自适应高度的多种方法方法小结
对于自适应高度的代码有很多,可效率什么的考虑进来好代码就不多见了,不过思路倒是差不多的 不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 ifram ...
- iframe自适应高度的多种方法方法小结(转)
对于自适应高度的代码有很多,可效率什么的考虑进来好代码就不多见了,不过思路倒是差不多的不带边框的iframe因为能和网页无缝的结合从而不刷新页面的情况下更新页面的部分数据成为可能,可是 iframe的 ...
- 使用事件捕获实时捕获img是否加载完毕, 实现iframe内容高度自动适应
如何判断在html中图片加载完毕呢? 给img图片加onload事件呗. 如何判断一个界面中所有的图片加载完毕呢? 给所有的图片加上onload事件呗. 如果有1000张图片那要怎么绑定事件呢? 我们 ...
- 关于Div的宽度与高度的100%设定
http://www.cnblogs.com/clare-zhang/archive/2011/08/26/2154220.html 正像你所知道的那样,设置DIV大小的有两个属性width和heig ...
- Div的宽度与高度的100%设定
div的100%是从其上一级div的宽高继承来的,所以必须设置其上一级div的宽度或高度,否则无效. 举例说明:父div(deman)宽300高200,子div(cc)如果在这个条件下设置divcc的 ...
- 关于div宽度和高度的100%设定
设置DIV大小的有两个属性width和height,以前在学习DIV每次给DIV设置100%宽度或高度时都很迷惑,不明白这个100%的宽度(高度)到底有多宽有多高?这个100%是从哪里得到的从哪里继承 ...
- 给body设置高度
今天做一个小demo,需要给body设置高度为100%,然鹅发现只设置body的height不可行,需,html,body{height:100%;}为何呢?一个容器的height是从上一级继承而来的 ...
随机推荐
- 【oneday_onepage】——How to stretch the life of your SSD storage
How to stretch the life of your SSD storage July 18, 2013, 9:06 PM — Once a PC enthusiast's dream st ...
- jQuery(十二);事件绑定
一.bind() bing()用来绑定事件,例如: 二.unbind() unbind()用来解除事件的绑定.例如: 三.on() on()方法用来绑定事件,例如: 四.off() off()方法用来 ...
- js学习(一)-对象和函数概念
//-----------------------js代码-------------------- function class1(){ //类成员的定义及构造函数 this.name = ...
- Android studio中出现Couldn't resolve resource @dimen/...
问题出现: Path.isConvex is not supported. Rendering problems .. Couldn't resolve resource @dimen/...等等 资 ...
- Java RMI 的使用及原理
1.示例 三个角色:RMIService.RMIServer.RMIClient.(RMIServer向RMIService注册Stub.RMIService在RMIClient lookup时向其提 ...
- 在kali linux之下安装wps之后 报错字体缺失
启动WPS for Linux后,出现提示"系统缺失字体" . 出现提示的原因是因为WPS for Linux没有自带windows的字体,只要在Linux系统中加载字体即可. 第 ...
- Prolog学习:数独和八皇后问题
上一篇简单介绍了下Prolog的一些基本概念,今天我们来利用这些基本概念解决两个问题:数独和八皇后问题. 数独 数独是一个很经典的游戏: 玩家需要根据n×n盘面上的已知数字,推理出所有剩余空格的数字, ...
- java web 过滤器跟拦截器的区别和使用
注:文章整理自知乎大牛以及百度网友(电脑网络分类达人 吕明),特此感谢! 一.过滤器 1.什么是过滤器? 过滤器是一个程序,它先于与之相关的servlet或JSP页面运行在服务器上.过滤器可附加到一个 ...
- 嵌入式驱动开发之内核态spi ---module_spi_driver
http://blog.csdn.net/dearsq/article/details/51839083 http://blog.csdn.net/alleincao/article/details/ ...
- C# 时间比较方法DateTime.Compare
public static int Compare(DateTime t1,DateTime t2) 返回值 类型:System..::.Int32 有符号数字,指示 t1 和 t2 的相对值. 值类 ...