zoukankan      html  css  js  c++  java
  • 原生JS 和 JQ 获取滚动条的高度,以及距离顶部的高度

    JQ:相对比较简便

    获取浏览器显示区域(可视区域)的高度 :   
    $(window).height();   
    获取浏览器显示区域(可视区域)的宽度 :
    $(window).width();   
    获取页面的文档高度   
    $(document).height();   
    获取页面的文档宽度 :
    $(document).width(); 
    浏览器当前窗口文档body的高度:  
    $(document.body).height();
    浏览器当前窗口文档body的宽度: 
    $(document.body).width();
    获取滚动条到顶部的垂直高度 (即网页被卷上去的高度)  
    $(document).scrollTop();   
    获取滚动条到左边的垂直宽度 :
    $(document).scrollLeft(); 
    获取或设置元素的宽度:
    $(obj).width();
    获取或设置元素的高度:
    $(obj).height();

     原生JS:
    document.documentElement.scrollTop //firefox
    
    document.documentElement.scrollLeft //firefox
    
    document.body.scrollTop //IE
    
    document.body.scrollLeft //IE

    像这种不兼容的获取方式,我们要做一下兼容,封装一个函数

                             function getScrollTop(){
                                                    var scroll_top = 0;
                                                    if (document.documentElement && document.documentElement.scrollTop) {//如果非IE
                                                        scroll_top = document.documentElement.scrollTop;
                                                    }
                                                    else if (document.body) {//IE浏览器
                                                        scroll_top = document.body.scrollTop;
                                                    };
                                                    return scroll_top;
                                                };

    网页工作区域的高度和宽度  

    document.documentElement.clientHeight// IE firefox  
    
    
  • 相关阅读:
    一个木桶的容积取决于最短的那块木板——木桶定律
    碰到系统故障了该怎么处理?
    我心中的程序员技术飞升之路
    编程名言(有些趣味性)
    haproxy部署配置
    安装mongodb插件
    安装redis扩展
    安装memcached扩展
    编译安装PHP7
    负载均衡
  • 原文地址:https://www.cnblogs.com/xxflz/p/10453068.html
Copyright © 2011-2022 走看看