zoukankan      html  css  js  c++  java
  • 原生js--兼容获取窗口滚动条位置和窗口大小的方法

    各个浏览器对获取获取窗口滚动条位置和窗口大小没有提供统一的API,以下是对其封装,解决兼容性问题

    /**
     * 获取浏览器视口的大小(显示文档的部分)
     *
     */
    function getViewPortSize(){
        // 除IE8及更早的版本以外的浏览器
        if( window.innerWidth != null ){
            return {
                w : window.innerWidth,
                h : window.innerHeight
            }
        }
        // 标准模式下的IE
        if( document.compatMode == "css1Compat" ){
            return {
                w : document.documentElement.clientWidth,
                h : document.documentElement.clientHeight
            }
        }
        // 怪异模式下的浏览器
        return {
            w : document.body.clientWidth,
            h : document.body.clientHeight
        }
    }

    /**
     *  获取窗口滚动条的位置
     */
    function getScrollOffset(){
        // 除IE8及更早版本
        if( window.pageXOffset != null ){
            return {
                x : window.pageXOffset,
                y : window.pageYOffset
            }
        }
        // 标准模式下的IE
        if( document.compatMode == "css1Compat" ){
            return {
                x : document.documentElement.scrollLeft,
                y : document.documentElement.scrollTop
            }
        }
        // 怪异模式下的浏览器
        return {
            x : document.body.scrollLeft,
            y : document.body.scrollTop
        }
    }

  • 相关阅读:
    正课day04
    正科day03
    正课day02
    正课day01
    预科day08
    Elasticsearch之-文档操作
    Elasticsearch之-映射管理
    Elasticsearch之-索引操作
    Elasticsearch之-倒排索引
    es安装官方,第三方插件
  • 原文地址:https://www.cnblogs.com/charling/p/3545342.html
Copyright © 2011-2022 走看看