height.js

```$(document).height(); //整个网页的高度
$(window).height(); //浏览器可视窗口的高度
$(window).scrollTop(); //浏览器可视窗口顶端距离网页顶端的高度(垂直偏移)

//当网页滚动条拉到最低端时
$(document).height() == $(window).height() + $(window).scrollTop() 网页可见区域宽[仅针对body]: document.body.clientWidth
网页可见区域高[仅针对body]: document.body.clientHeight
网页可见区域宽[仅针对body]: document.body.offsetWidth (包括滚动条和边框,若滚动条和边框为0,则和clientWidth相等)
网页可见区域高[仅针对body]: document.body.offsetHeight (包括滚动条和边框,若滚动条和边框为0,则和clientHeight相等)
可视窗口宽度(包括滚动轴宽度):window.innerWidth; //IE9+、Chrome、Firefox、Opera 以及 Safari
可视窗口高度,不包括浏览器顶部工具栏: window.innerHeight;//IE9+、Chrome、Firefox、Opera 以及 Safari
网页正文全文宽(不包括滚动轴的宽度): document.body.scrollWidth
网页正文全文高:document.body.scrollHeight//假如网页中没有滚动轴,
document.body.scrollWidth和window.innerWidth相等,document.body.scrollHeight和window.innerHeight相等。

网页被卷去的高: document.body.scrollTop
网页被卷去的左: document.body.scrollLeft
网页正文部分上: window.screenTop
网页正文部分左: window.screenLeft
屏幕分辨率的高(整个屏幕的高度): window.screen.height
屏幕分辨率的宽(整个屏幕的宽度): window.screen.width
屏幕可用工作区高度: window.screen.availHeight
屏幕可用工作区宽度: window.screen.availWidth
整个浏览器可用工作区高度: window.outerHeight
整个浏览器可用工作区宽度: window.outerWidth

```

js、jQuery各种高度的更多相关文章

  1. [JS]jQuery,javascript获得网页的高度和宽度

    [JS]jQuery,javascript获得网页的高度和宽度网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeigh ...

  2. jquery、js获取页面高度宽度等

    jquery获取页面高度宽度 //获取浏览器显示区域(可视区域)的高度 : $(window).height(); //获取浏览器显示区域(可视区域)的宽度 : $(window).width(); ...

  3. js/jquery/html前端开发常用到代码片段

    1.IE条件注释 条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法.条件注释只能用于IE5以上,IE ...

  4. js+jquery+html实现在三种不通的情况下,点击图片放大的效果

    js+jquery+html实现在三种不通的情况下,点击图片放大的效果. 三种情况分别是:图片的父元素宽高固定;  图片的宽高固定;  图片的父元素宽固定,高度不固定 第一种情况:图片的父元素宽高固定 ...

  5. js+jquery+css3

    (原生js+jquery+css3) 前言 项目需求要弄个瀑布流的页面,用的是waterfall这个插件,感觉还是可以的,项目赶就没自己的动手写.最近闲来没事,就自己写个.大致思路理清楚,还是挺好实现 ...

  6. js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的

    js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...

  7. UI自动化之js\jquery的应用

    js\jquery的应用,有很多难以定位到的,可以通过js或者jquery来处理 目录 1.js 2.jquery 1.js 1.1js有5种定位,最后execute_script(js)来执行js ...

  8. js,jquery,css,html5特效

    包含js,jquery,css,html5特效,源代码 本文地址:http://www.cnblogs.com/roucheng/p/texiao.html 2017新年快乐特效 jQuery最新最全 ...

  9. Js/Jquery获取iframe中的元素

    转载: Js/Jquery获取iframe中的元素 - - ITeye技术网站http://java-my-life.iteye.com/blog/1275205 在web开发中,经常会用到ifram ...

  10. js jquery 页面加载初始化方法

    js jquery 页面加载初始化方法 一.js页面加载初始化方法 // 1.在body里面写初始化方法. <body onload='init()'> </body> < ...

随机推荐

  1. Android_(控件)使用ImageView简单实现图片翻转

    效果图 1)可以把图像的id存放数组中,利用setImageResource()或setImageDrawable()方法(放在数组中便于循环) 2)已经是第一张图像时,再点击“上一页”,应Toast ...

  2. Partial Dependence Plot

    Partial Dependence就是用来解释某个特征和目标值y的关系的,一般是通过画出Partial Dependence Plot(PDP)来体现. PDP是依赖于模型本身的,所以我们需要先训练 ...

  3. vue的通信方式(二)---祖父孙三个级别的之间的隔代通信

    在之前的文章中我们提到了vue常用的几种通信方式,如父子,子父,以及兄弟组件之间的通信,可以通过这个传送门了解他们:Vue通信方式(一) 当我们如果遇到祖组件,父组件,孙组件,三个级别嵌套时,我们该怎 ...

  4. b+tree索引在MyIsam和InnoDB的不同实现方式

    普通二叉搜索树当索引的劣势: (1)每个节点占用的空间太少,不能很好的利用磁盘的预读性 (2)数据不规律的话,很可能形成链表 (3)频繁IO b树当索引机制相比于二叉树的优势和劣势: (1)每个节点有 ...

  5. TCP输入 之 tcp_rcv_established

    概述 tcp_rcv_established用于处理已连接状态下的输入,处理过程根据首部预测字段分为快速路径和慢速路径: 1. 在快路中,对是有有数据负荷进行不同处理: (1) 若无数据,则处理输入a ...

  6. Nginx-rtmp之监听端口的管理

    1. 概述 监听端口属于 server 虚拟主机,它是由 server{} 块下的 listen 配置项决定的. 每监听一个 TCP 端口,都将使用一个独立的 ngx_rtmp_conf_port_t ...

  7. Laravel5.2中Eloquent与DB类的区别是什么?

    要了解这些先看看关于数据库组件的那些事儿(就是 Eloquent ORM) 数据库组件大概分了三层: 数据库连接层 查询构造层 应用层 来看一下每一层有哪些东西,分别对应文档的哪一部分: 数据库连接层 ...

  8. javascript之Prototype属性

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. 修改Android EditText光标颜色和底线颜色

    1.修改光标颜色 EditText有一个属性:android:textCursorDrawable,这个属性是用来控制光标颜色的android:textCursorDrawable="@nu ...

  10. Failed to install the following Android SDK packages as some licences have not been accepted.

    问题描述: 执行gradle tasks报错: gradle tasks > Configure project :app Exception /package.xml. Probably th ...