BOM-scroll系列

一、scrollWidth与scrollHeight

  当标签内容大于标签高宽时：内容实际的高宽（不包括边框）
  如果标签中内容为空或者内容高宽小于标签高宽: srcollWidth = offsetWidth - border;

二、scrollTop与scrollLeft

  scrollTop：对象向上卷曲出去的距离
  scrollLeft：对象向左卷曲出去的距离
  使用一个小案例来说明scrollTop的作用，代码如下。当滑动#dv对象时，浏览器就可以利用scrollTop属性显示#dv对象滑动距离：

    
        
        
    
    
        scroll
        
1111111111
            111111111111
            111111111111111
            1111111111111
            1111111111111
            11111111111111
            11111111111
            111111111111
            1111111111111
            111111111111
            1111111111111
        
    
    

srcoll案例

  在计算整个页面的滑动距离时 scrollTop与scrollLeft的兼容问题：
   IE：
    对于没有doctype声明的页面，使用 document.body.scrollTop 或 document.documentElement.scrollTop；
    对于有doctype声明的页面，则使用 document.documentElement.scrollTop；
   Chrome、Firefox：
    对于没有doctype声明的页面，使用 document.body.scrollTop 来获取 scrollTop高度 ；
    对于有doctype声明的页面，则使用 document.documentElement.scrollTop；
   Safari:
    safari 比较特别，有自己获取scrollTop的函数 ： window.pageYOffset ；
  因此，为了兼容所有浏览器，封装一个函数，去获取页面向上卷曲出去的距离和向左卷曲出去的距离

function getScroll(){
  return {
    left:window.pageXOffset||document.documentElement.scrollLeft||document.body.scrollLeft||0,
    top:window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0
  }
}