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. DataGridView 行、列的隐藏和删除

    ) 行.列的隐藏 [VB.NET] ' DataGridView1的第一列隐藏 DataGridView1.Columns(0).Visible = False ' DataGridView1的第一行 ...

  2. 19Spring_AOP编程(AspectJ)_使用@Pointcut注解来定义切点

    我们之前的方式是采用 @AfterReturning(value="execution(* com.guigu.shen.anotion.UserDaoImpl.*(..))",r ...

  3. 教你10分钟内在Windows上完成Rails开发环境的安装和配置

    原文:http://www.cnblogs.com/tambor/archive/2011/12/25/rails_anzhuang_railsinstaller.html 一般来说,Windows开 ...

  4. NET Office 组件Spire

    高效而稳定的企业级.NET Office 组件Spire   在项目开发中,尤其是企业的业务系统中,对文档的操作是非常多的,有时几乎给人一种错觉的是"这个系统似乎就是专门操作文档的" ...

  5. 磁盘操作- inode/Block深入实战

    一 思路: 1,磁盘物理结构及大小计算 2,分区 MBR GPT知识 3,fdisk分区 挂载 自动挂载 4,格式化文件系统 5,inode block 软硬链接 查看磁盘: [root@moban ...

  6. web页面的回流,认识与避免

    一.什么是回流? 回流是会导致页面重新渲染的一些元素,从而影响性能. 二.哪些因素会导致回流? 1.调整窗口的大小: 2.改变字体,如果用rem  设置了根目录的字体大小,这样就减少了回流的次数: 3 ...

  7. PHP基础14:表单处理

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. Node.js文件系统、路径的操作函数

    Node.js文件系统.路径的操作函数 目录 Node.js文件系统.路径的操作函数 1.读取文件readFile函数 2.写文件 3.以追加方式写文件 4.打开文件 5.读文件,读取打开的文件内容到 ...

  9. node-webkit 写桌面系统

    [1.使用nodejs] 和很多人一样,百度了很久很久,没看到有恰到点的解释的,当时我已经怀疑到是配置出来的,而非引js,最后确实啥都不用引 实际关键在package.json加入设置"no ...

  10. [CareerCup] 13.1 Print Last K Lines 打印最后K行

    13.1 Write a method to print the last K lines of an input file using C++. 这道题让我们用C++来打印一个输入文本的最后K行,最 ...