• js 和 jquery 获取页面和滚动条的高度
  • //页面位置及窗口大小
  • function GetPageSize() {
  • var scrW, scrH;
  • if(window.innerHeight
  • && window.scrollMaxY)
  • {    // Mozilla
  • scrW =
  • window.innerWidth + window.scrollMaxX;
  • scrH = window.innerHeight +
  • window.scrollMaxY;
  • }
  • else if(document.body.scrollHeight >
  • document.body.offsetHeight)
  • {    // all but IE Mac
  • scrW =
  • document.body.scrollWidth;
  • scrH = document.body.scrollHeight;
  • } else
  • if(document.body)
  • { // IE Mac
  • scrW = document.body.offsetWidth;
  • scrH = document.body.offsetHeight;
  • }
  • var winW, winH;
  • if(window.innerHeight)
  • { // all except IE
  • winW =
  • window.innerWidth;
  • winH = window.innerHeight;
  • } else if
  • (document.documentElement &&
  • document.documentElement.clientHeight)
  • {    // IE 6 Strict Mode
  • winW =
  • document.documentElement.clientWidth;
  • winH =
  • document.documentElement.clientHeight;
  • } else if (document.body) { //
  • other
  • winW = document.body.clientWidth;
  • winH =
  • document.body.clientHeight;
  • }    // for small pages with total size less
  • then the viewport
  • var pageW = (scrW<winW) ? winW : scrW;
  • var pageH =
  • (scrH<winH) ? winH : scrH;
  • return {PageW:pageW, PageH:pageH,
  • WinW:winW, WinH:winH};
  • };
  • //滚动条位置
  • function GetPageScroll()
  • {
  • var x, y;
  • if(window.pageYOffset)
  • {    // all except IE
  • y =
  • window.pageYOffset;
  • x = window.pageXOffset;
  • } else
  • if(document.documentElement && document.documentElement.scrollTop)
  • {    // IE 6 Strict
  • y = document.documentElement.scrollTop;
  • x
  • = document.documentElement.scrollLeft;
  • } else if(document.body) {    // all
  • other IE
  • y = document.body.scrollTop;
  • x =
  • document.body.scrollLeft;
  • }
  • return {X:x,
  • Y:y};
  • }
  • jquery
  • 获取浏览器显示区域的高度 :
  • $(window).height();
  • 获取浏览器显示区域的宽度 :$(window).width();
  • 获取页面的文档高度
  • :$(document).height();
  • 获取页面的文档宽度 :$(document).width();
  • 获取滚动条到顶部的垂直高度
  • :$(document).scrollTop();
  • 获取滚动条到左边的垂直宽度 :$(document).scrollLeft();
  • 计算元素位置和偏移量
  • offset方法是一个很有用的方法,它返回包装集中第一个元素的偏移信息。默认情况下是相对body的偏移信息。结果包含 top和left两个属性。
  • offset(options, results)
  • options.relativeTo  指定相对计
  • 算偏移位置的祖先元素。这个元素应该是relative或absolute定位。省略则相对body。
  • options.scroll  是否把
  • 滚动条计算在内,默认TRUE
  • options.padding  是否把padding计算在内,默认false
  • options.margin
  •   是否把margin计算在内,默认true
  • options.border  是否把边框计算在内,默认true
  • http://www.cnblogs.com/hoojo/archive/2012/02/16/2354663.html
  • alert($(window).height()); //浏览器当前窗口可视区域高度
  • alert($(document).height()); //浏览器当前窗口文档的高度
  • alert($(document.body).height());//浏览器当前窗口文档body的高度
  • alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin
  • alert($(window).width()); //浏览器当前窗口可视区域宽度
  • alert($(document).width());//浏览器当前窗口文档对象宽度
  • alert($(document.body).width());//浏览器当前窗口文档body的高度
  • alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度 包括border padding margin
  • // 获取页面的高度、宽度
  • function getPageSize() {
  • var xScroll, yScroll;
  • if (window.innerHeight && window.scrollMaxY) {
  • xScroll = window.innerWidth + window.scrollMaxX;
  • yScroll = window.innerHeight + window.scrollMaxY;
  • } else {
  • if (document.body.scrollHeight > document.body.offsetHeight) { // all but Explorer Mac
  • xScroll = document.body.scrollWidth;
  • yScroll = document.body.scrollHeight;
  • } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
  • xScroll = document.body.offsetWidth;
  • yScroll = document.body.offsetHeight;
  • }
  • }
  • var windowWidth, windowHeight;
  • if (self.innerHeight) { // all except Explorer
  • if (document.documentElement.clientWidth) {
  • windowWidth = document.documentElement.clientWidth;
  • } else {
  • windowWidth = self.innerWidth;
  • }
  • windowHeight = self.innerHeight;
  • } else {
  • if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
  • windowWidth = document.documentElement.clientWidth;
  • windowHeight = document.documentElement.clientHeight;
  • } else {
  • if (document.body) { // other Explorers
  • windowWidth = document.body.clientWidth;
  • windowHeight = document.body.clientHeight;
  • }
  • }
  • }
  • // for small pages with total height less then height of the viewport
  • if (yScroll < windowHeight) {
  • pageHeight = windowHeight;
  • } else {
  • pageHeight = yScroll;
  • }
  • // for small pages with total width less then width of the viewport
  • if (xScroll < windowWidth) {
  • pageWidth = xScroll;
  • } else {
  • pageWidth = windowWidth;
  • }
  • arrayPageSize = new Array(pageWidth, pageHeight, windowWidth, windowHeight);
  • return arrayPageSize;
  • }
  • // 滚动条
  • document.body.scrollTop;
  • $(document).scrollTop();

js 和 jquery 获取页面和滚动条的高度 视口高度文档高度的更多相关文章

  1. jquery 获取页面和滚动条的高度

    1.获取浏览器显示区域的高度 : $(window).height(); 2.获取浏览器显示区域的宽度 : $(window).width(); 3.获取页面的文档高度 : $(document).h ...

  2. js和jquery实现页面滚动监听

    js和jquery实现页面滚动监听 一.总结 一句话总结:onscroll方法和监听页面元素的高度都可以实现滚动监听. 1.onscroll方法实现滚动监听的核心代码是什么? <body ons ...

  3. JavaScript、jQuery获取页面及个元素高度、宽度

    Javascript获取获取屏幕.浏览器窗口 ,浏览器,网页高度.宽度的大小网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.client ...

  4. js、jQuery 获取文档、窗口、元素的各种值

    基于两年开发经验,总结了 javascript.jQuery 获取窗口.文档.元素的各种值 javascript: 文档:是整个document所有的内容 浏览器当前窗口文档body的宽度: docu ...

  5. jQuery获取页面及个元素高度、宽度

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

  6. offsetWidth、clientWidth、width、scrollWidth区别及js与jQuery获取的方式

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. jQuery 获取页面元素的属性值

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

  8. jQuery获取页面及个元素高度、宽度【转】

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

  9. 用JS或jQuery访问页面内的iframe,兼容IE/FF

    用JS或jQuery访问页面内的iframe,兼容IE/FF js或者jQuery访问页面中的框架也就是iframe.注意:框架内的页面是不能跨域的! 假设有两个页面,在相同域下. index.htm ...

随机推荐

  1. cocos2dx游戏开发——微信打飞机学习笔记(九)——BulletLayer的搭建

    一.创建文件~ BulletLayer.h BulletLayer.cpp 二.How to do? (1)实例化BulletLayer方法的实现~ Bullet(PlayerLayer* temp) ...

  2. javascript优化--09模式(代码复用)02

    原型继承 ://现代无类继承模式 基本代码: var parent = { name : "Papa" } var child = object(parent); function ...

  3. 数学 赛码 1010 GCD

    题目传送门 /* 数学:官方题解 首先,数组中每个元素至少是1 然后对于任意一个询问Li, Ri, Ansi, 说明Li ~ Ri中的元素必定是Ansi的倍数,那么只需将其与Ansi取最小公倍数即可 ...

  4. BZOJ1175 : [Balkan2007]The stairways of Saharna

    杨氏图表,维护若干个单调不下降队列. 每次新加入一个数时,先考虑第一个队列: 如果可以放在最后,则放在最后. 否则找到最小的可以替换的替换掉,再将替换的数放入第二个队列,以此类推. 最后$ans_i= ...

  5. BZOJ3830 : [Poi2014]Freight

    首先为了保证发车时间都不同,T[i]=max(T[i],T[i-1]+1) 然后设f[i]表示前i列车回来的最早时刻 f[i]=min(max(T[i],f[j]+i-j-1)+s*2+i-j-1) ...

  6. POJ 2763 (树链剖分+边修改+边查询)

    题目链接:http://poj.org/problem?id=2763 题目大意:某人初始在s点.有q次移动,每次移动沿着树上一条链,每经过一条边有一定花费,这个花费可以任意修改.问每次移动的花费. ...

  7. html5中manifest特性测试

    测试环境和工具   chromium  18.0.1025.151 (开发编译版 130497 Linux) Ubuntu 11.04 一.测试内容 1.A页面manifest缓存的js文件,B页面不 ...

  8. WebRTC手记之本地音频采集

    转载请注明出处:http://www.cnblogs.com/fangkm/p/4374668.html 上一篇博文介绍了本地视频采集,这一篇就介绍下音频采集流程,也是先介绍WebRTC原生的音频采集 ...

  9. win7 无法复制粘贴

     win7 无法复制粘贴解决办法 在开始-运行里输入以下命令 regsvr32 shdocvw.dll ,确定,接着出现一个消息框,确定 regsvr32 oleaut32.dll,确定,接着出现一个 ...

  10. 使用本地yum源

    [root@xaiofan ~]# mount /dev/sr0 /mnt/ [root@xaiofan ~]# cat /etc/yum.repos.d/local.repo [loacl]name ...