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. uGUI练习(二) Animate UI

    练习目标 通过Animation录制UI动画 一.步骤 1.创建一个Panel,下面再创建两个子Panel 2.修改Canvas的 Render Mode为Screen Space-Camer 3.为 ...

  2. Wooyun隐写术总结

    之前还没有见到drops上有关于隐写术的总结,我之前对于隐写术比较有兴趣,感觉隐写术比较的好玩.所以就打算总结总结一些隐写术方面的东西.写的时候,可能会有错误的地方,请不吝赐教,谢谢. 本篇章中用到的 ...

  3. 通过TTL值判断系统

    我们做网络的渗透测试,开始的时候会ping一下网站判断一下网站使用的系统,默认情况下, UNIX 255 LINUX 64WIN2K/NT 128WINDOWS 32 但是 每经过一个路由器就会减1这 ...

  4. Spring Batch实践

    Spring Batch在大型企业中的最佳实践 在大型企业中,由于业务复杂.数据量大.数据格式不同.数据交互格式繁杂,并非所有的操作都能通过交互界面进行处理.而有一些操作需要定期读取大批量的数据,然后 ...

  5. UI设计师零基础入门到精通精品视频教程【155课高清完整版】

    [福吧资源网分享]课程是非常完整的,也是非常零基础的,适合任何学员,有需要的可以下载看看!课程目录:第1章 Adobe Photoshop CS6课时1 Adobe Photoshop CS6入门基础 ...

  6. 一款Android开源的下拉刷新动画

    无意间在GitHub看到的,就Down了下来.但是作者是用AndroidStudio开发的,这边移动Eclipse供小伙伴们下载使用. 截图 这么好的东西因为字数不够不让分享,得了,贴段代码吧 pac ...

  7. Week2学习过程报告

    一.学习内容 1. 熟悉Linux系统下的开发环境   2. 熟悉vi的基本操作   3. 熟悉gcc编译器的基本原理   4. 熟练使用gcc编译器的常用选项   5 .熟练使用gdb调试技术    ...

  8. python实现简易数据库之二——单表查询和top N实现

    上一篇中,介绍了我们的存储和索引建立过程,这篇将介绍SQL查询.单表查询和TOPN实现. 一.SQL解析 正规的sql解析是用语法分析器,但是我找了好久,只知道可以用YACC.BISON等,sqlit ...

  9. 记录毕业论文 LanguageTool 二次开发时用到的网站

    LanguageTool Development LanguageTool Supported Languages Share your knowledge about LT - LanguageTo ...

  10. 4.HBase In Action 第一章-HBase简介(1.1.2 数据创新)

    As we now know, many prominent internet companies, most notably Google, Amazon, Yahoo!, and Facebook ...