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是从上一级继承而来的 ...
随机推荐
- mpvue上手教程
mpvue官网上面已经有了详细的步骤,把每个步骤截图及输出结果做个笔记,供各位看官参考参考~ 1.全局安装 vue-cli $ npm install --global vue-cli 如果你已经设置 ...
- 通过android studio上传项目到github
第一步,下载git客户端,并且安装 下载地址:https://git-for-windows.github.io/ 第二步,在android studio中配置git(注意第一张图中的C:\Progr ...
- Servlet、Filter、Listener总结
servlet规范提供了一组标准的servlet api.servlet容器就是servlet规范的实现. 1.In Action (1)写一个类继承HttpServlet: (2)重写其中的方法. ...
- DevExpressXtraReport—制作雷达图
存储过程: SET ANSI_NULLS ON GO SET QUOTED_IDENTIFIER ON GO -- ========================================== ...
- Android学习之ListView使用基础
1.ListView的简单用法 1.1 布局 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/andro ...
- CentOS执行ping命令报错 name or service not know
在虚拟机上安装的CentOS,但是当执行ping命令的时候,提示name or service not known 解决方法如下: 1. 添加DNS服务器 vi /etc/resolv.conf 1 ...
- 【CUDA学习】__syncthreads的理解
__syncthreads()是cuda的内建函数,用于块内线程通信. __syncthreads() is you garden variety thread barrier. Any thread ...
- mysql查询常用小语句
mysql 查询某个库里表的数量 在mysql中有个数据库information_schema下的表tables记录了所有数据库中所有的表相关信息 TABLE_SCHEMA 数据库名称 SELECT ...
- tpshop商品属性表关系
TPshop 里面的商品属性, 首先看看TPshop商品详情中的属性介绍, 纯展示给用户看的. 再来tpshop看看商品列表帅选页面的属性,可以根据属性帅选不同的商品 再来看看tpshop后台属性管理 ...
- (转)PCM数据格式
1. 音频简介 经常见到这样的描述: 44100HZ 16bit stereo 或者 22050HZ 8bit mono 等等. 44100HZ 16bit stereo: 每秒钟有 4410 ...