码迷,mamicode.com
首页 > 其他好文 > 详细

document.body.scrollTop 各浏览器兼容性解决

时间:2016-06-06 18:54:52      阅读:125      评论:0      收藏:0      [点我收藏+]

标签:

  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 各浏览器兼容性解决

标签:

原文地址:http://www.cnblogs.com/malvina/p/5564437.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!