document.compatMode:获取当前浏览器采用的渲染方式。主要是浏览器的模式,有两个:BackCompat,CSS1Compat。其中前者是怪异模式,后者是标准模式。

    IE默认是BackCompat模式,Gecko内核的浏览器只在table中图片层上不同,可以认为CSS1Compat标准模式document.compatMode等于BackCompat时,浏览器客户区宽度是document.body.clientWidth; 
  当document.compatMode等于CSS1Compat时,浏览器客户区宽度是document.documentElement.clientWidth。 
  浏览器客户区高度、滚动条高度、滚动条的Left、滚动条的Top等等都是上面的情况。 
  一个准确获取网页客户区的宽高、滚动条宽高、滚动条Left和Top的代码: 

if (document.compatMode == \"BackCompat\") 

  cWidth = document.body.clientWidth; 
  cHeight = document.body.clientHeight; 
  sWidth = document.body.scrollWidth; 
  sHeight = document.body.scrollHeight; 
  sLeft = document.body.scrollLeft; 
  sTop = document.body.scrollTop; 

else 

  //document.compatMode == \"CSS1Compat\" 
  cWidth = document.documentElement.clientWidth; 
  cHeight = document.documentElement.clientHeight; 
  sWidth = document.documentElement.scrollWidth; 
  sHeight = document.documentElement.scrollHeight; 
  sLeft = document.documentElement.scrollLeft == 0 ? document.body.scrollLeft : document.documentElement.scrollLeft; 
  sTop = document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop; 
}

document.body.scrollTop 各浏览器兼容性解决的更多相关文章

  1. AngularJS进阶(三十五)浏览器兼容性解决之道

    浏览器兼容性解决之道 前言 浏览器兼容性一直是前端开发中不得不面对的一个问题.而最突出的就是IE.对绝大多数公司来说,兼容IE6的性价比已经很低,而IE7则几乎已经绝迹.所以,常见的兼容性下限是IE8 ...

  2. document.documentElement.scrollTop指定位置失效解决办法

    近期在vue的H5项目中,做指定位置定位的时候发现使用document.documentElement.scrollTop一直不生效. 解决办法是document.documentElement.sc ...

  3. 浏览器hack总结 详细的浏览器兼容性解决方法

    由于各浏览器对页面的解析不同,会导致页面在不同浏览器中显示的样式不一致,为了保持页面的统一,经常需要对浏览器进行兼容性问题的调试. CSS Hack 面对浏览器诸多的兼容性问题,经常需要通过CSS样式 ...

  4. document.body.scrollTop值为0的解决方法[转]

    做页面的时候可能会用到位置固定的层,读取document.body.scrollTop来设置层的位置,像这样,       window.onscroll=function () {          ...

  5. IE浏览器和Firefox浏览器兼容性问题及解决办法

    IE浏览器和Firefox浏览器兼容性问题及解决办法 为了方便大家阅读代码,以下以 IE 代替 Internet Explorer,以 MF/FF 代替 Mozzila Firefox : 1.//w ...

  6. (转) 淘淘商城系列——解决KindEditor上传图片浏览器兼容性问题

    http://blog.csdn.net/yerenyuan_pku/article/details/72808229 上文我们已实现了图片上传功能,但是有个问题,那就是对浏览器兼容性不够,因为Map ...

  7. document.body.scrollTop无效的解决方法

    1.document.body.scrollTop = 0 有时候不生效,两种解决方案,试试看. 1-1.设置:document.documentElement.scrollTop = 0;1-2.设 ...

  8. 火狐、谷歌、IE关于document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题

    一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取document.body.scrollTop来设置层的位置,像这样, window.on ...

  9. web前端开发浏览器兼容性 - 持续更新

    浏览器兼容性问题又被称为网页或网站兼容性问题:不同浏览器内核及所支持的html等网页语言标准不同,不同客户端环境(如分辨率不同)造成实际显示效果未能达到预期理想效果 首先我们来看一下目前市面上常见的一 ...

随机推荐

  1. 二维背包(钟神想要的)(不是DP)

    [问题描述] 背包是个好东西,希望我也有.给你一个二维的背包,它的体积是? × ?.现在你有一些大小为1× 2和1×3的物品,每个物品有自己的价值.你希望往背包里面装一些物品,使得它们的价值和最大,问 ...

  2. java 20 -1 递归的概述和案例

    /* * 递归:方法定义中调用方法本身的现象 * * 方法的嵌套调用,这不是递归. * Math.max(Math.max(a,b),c); * * public void show(int n) { ...

  3. 转: 最值得阅读学习的 10 个 C 语言开源项目代码

    from: http://www.iteye.com/news/29665 1. Webbench Webbench是一个在linux下使用的非常简单的网站压测工具.它使用fork()模拟多个客户端同 ...

  4. 两种方式判断类的存在→className getAttribute

    通过className获取 var p = document.getElementsByTagName('p'); for(var i = 0;i <p.length;i++){ if(p[i] ...

  5. poj1144

    Network Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 12521   Accepted: 5760 Descript ...

  6. 【WPF】WPF通过RelativeSource绑定父控件的属性

    1.后台代码实现绑定父控件的属性 RelativeSource rs = new RelativeSource(RelativeSourceMode.FindAncestor); //设定为离自己控件 ...

  7. VC/Wince 实现仿Win8 Metro风格界面3——按钮移动交换、删除、添加快捷方式(附效果图)

    上一篇文章写了如何进行页面滑动切换,今天我讲一下如何实现两个按钮拖动交换位置,包括同一个页面按钮交换或者两个页面之间的按钮交换.另外就是如何拖动删除界面上的快捷方式.按钮交换和拖动删除,这两个功能基本 ...

  8. 在Linux用libcurl.a在链接的时候出错

    其实出错是因为curl链接的时候需要别的库.我用如下方法解决 1.http://curl.haxx.se/download/curl-7.45.0.tar.gz官网下载源码 2../configure ...

  9. RequiredFieldValidator 根据group组来触发验证

    今天在开发过程中遇到了这样一个问题 在这个用户添加界面中,我使用了多个验证控件RequiredFieldValidator,分别控制用户名密码.在默认情况下,当单击“检查用户名”时,密码的验证控件也被 ...

  10. 从0开始学Java——从jsp到servlet转换的各种辅助元素介绍

    1. 指示元素,<%@指示元素 [属性=值]* %> 其中指示元素包括page, include, 和tablib三个. 其中  属性=值 可以有多对. 其中page用来告知容器如何转译目 ...