//定义全局变量
var winWidth = 0; /*窗口宽度*/
var winHeight = 0; /*窗口高度*/ //函数区 //实时获取浏览器窗口大小,当窗口大小变化开始相应操作 function winchange() {
//获取窗口宽度
if (window.innerWidth)
winWidth = window.innerWidth;
else if ((document.body) && (document.body.clientWidth))
winWidth = document.body.clientWidth;
//获取窗口高度
if (window.innerHeight)
winHeight = window.innerHeight;
else if ((document.body) && (document.body.clientHeight))
winHeight = document.body.clientHeight;
//通过深入Document内部对body进行检测,获取窗口大小
if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth) {
winHeight = document.documentElement.clientHeight; //获取视窗高度
winWidth = document.documentElement.clientWidth; //获取视窗宽度
} //根据窗口变化调整网页各版块高度 自用函数区
   $(".middle").height(winHeight-$(".header").height()-$(".foot").height());/*中间内容的高度*/ }

$(function(){


//根据窗口大小计算布局高度
  winchange();
  window.onresize=winchange;

});

移动端宽高适配JS的更多相关文章

  1. 【Android 应用开发】 自定义组件 宽高适配方法, 手势监听器操作组件, 回调接口维护策略, 绘制方法分析 -- 基于 WheelView 组件分析自定义组件

    博客地址 : http://blog.csdn.net/shulianghan/article/details/41520569 代码下载 : -- GitHub : https://github.c ...

  2. 微信小程序宽高适配

    小程序的宽任何机型都是750rpx,但是画布canvas的默认单位是px,可能会出现需要怪异的样式,我们可以用到 wx.getSystemInfoSync().windowWidth和 wx.getS ...

  3. 移动端rem字体适配JS

    // 『REM』手机屏幕适配,兼容更改过默认字体大小的安卓用户 function adapt(designWidth, rem2px) { // designWidth:'设计图宽度' 1rem==r ...

  4. JS 、JQ 获取宽高总结 & JS中getBoundingClientRect的作用及兼容方案

    1.getBoundingClientRect的作用 getBoundingClientRect用于获取某个html元素相对于视窗的位置集合.   执行 object.getBoundingClien ...

  5. js获取屏幕(设备)宽高

    平常获取设备的宽高无非就那几 <script language="javascript"> var h = ""; h += " 网页可见 ...

  6. 翻屏类 h5 适配方案:解决宽高自适应难题

    表格 图片等 宽度自适应  :width:100%;  box-sizing: border-box; 基于淘宝适配方案flexible + 翻屏h5 适配方案adaptive flexible解读及 ...

  7. js 和 jquery 里面几个获取宽高的调查

    罗列下 js 和 jquery 里面获取宽高的方法: obj.offsetWidth = $obj.outerWidth()  // offsetWidth obj.clientWidth = obj ...

  8. 前端 JS 获取 Image 图像 宽高 尺寸

    前端 JS 获取 Image 图像 宽高 尺寸 简介 项目中用到获取图片的原始尺寸,然后适配宽高:网上的大部分前端解决方案,都是new Image()后,在onload事件中获取image的尺寸. 在 ...

  9. js获取隐藏元素宽高的方法

    网上有一些js获取隐藏元素宽高的方法,但是可能会存在某些情况获取不了. 例如: <!DOCTYPE html> <html lang="en"> <h ...

随机推荐

  1. 断路器Hystrix(Ribbon)

    微服务架构中,根据业务划分成若干个服务,各单元应用间通过服务注册与订阅的方式互相依赖,依赖通过远程调用的方式执行,该方式难以避免因网络或自身原因而出现故障或者延迟,从而并不能保证服务的100%可用,此 ...

  2. cat快速查找文件内指定信息

    cat log.txt | grep "ERROR" | more 查找 log.txt 文件内 包含 “ERROR”  的信息,分屏显示

  3. 面向对象之继承以及抽象(Java实现)

    回顾封装 关于面向对象三大特性,我们可以很自信的回答:封装.继承.多态 之前学习的封装,可以很直观的理解为了保护数据,我们在idea中可以用alt+insert进行一个选择 constructer构造 ...

  4. P2034 选择数字——线性dp(单调队列优化)

    选择数字 题目描述 给定一行 \(n\) 个非负整数 \(a[1]...a[n]\) .现在你可以选择其中若干个数,但不能有超过 \(k\) 个连续的数字被选择.你的任务是使得选出的数字的和最大. 输 ...

  5. JAVA服务实例内存高问题排查及解决

    生产服务内存高问题 问题描述 1."计算中心" 服务在生产环境运行一段时间后,实际占用内存4.8G,业务运行正常,未出现OOM.(本文以此服务进行排查) 2.生产环境的老项目,均出 ...

  6. Yii2源码分析(一):入口

    写在前面,写这些随笔是记录下自己看Yii2源码的过程,可能会有些流水账,大部分解析放在注释里说明,由于个人水平有限,有不正确的地方还望斧正. web入口文件Index.php // 定义全局的常量,Y ...

  7. 动手实现一个简单的 rpc 框架到入门 grpc (上)

    rpc 全称 Remote Procedure Call 远程过程调用,即调用远程方法.我们调用当前进程中的方法时很简单,但是想要调用不同进程,甚至不同主机.不同语言中的方法时就需要借助 rpc 来实 ...

  8. java 面向对象(十五):面向对象的特征三:多态性

    1.多态性的理解:可以理解为一个事物的多种形态.2.何为多态性:对象的多态性:父类的引用指向子类的对象(或子类的对象赋给父类的引用)举例:Person p = new Man();Object obj ...

  9. cnn卷积理解

    首先输入图像是28*28处理好的图. 第一层卷积:用5*5的卷积核进行卷积,输入为1通道,输出为32通道.即第一层的输入为:28*28图,第一层有32个不同的滤波器,对同一张图进行卷积,然后输出为32 ...

  10. JavaScript图形实例:平面镶嵌图案

    用形状.大小完全相同的一种或几种平面图形进行拼接,彼此之间不留空隙.不重叠地铺成一片,就叫做这几种图形的平面镶嵌. 1.用一种多边形实现的平面镶嵌图案 我们可以采用正三角形.正方形或正六边形实现平面镶 ...