zoukankan      html  css  js  c++  java
  • js 获取浏览器显示内容的宽度和高度

    js获取浏览器显示内容的宽度和高度

    CreateTime--2017年7月10日17:24:12
    Author:Marydon

    1.获取浏览器屏幕显示d的网页宽度

    /**
     * 得到浏览器显示的屏幕高度
     */  
    function getViewHeight() {
        if (window.innerHeight != window.undefined)
            return window.innerHeight;
        if (document.compatMode == 'CSS1Compat')
            return document.documentElement.clientHeight;
        if (document.body)
            return document.body.clientHeight;
        return window.undefined;
    }

    2.获取浏览器屏幕显示d的网页高度

    /**
     * 得到浏览器显示的屏幕宽度
     */
    function getViewWidth() {
        if (window.innerWidth != window.undefined)
            return window.innerWidth;
        if (document.compatMode == 'CSS1Compat')
            return document.documentElement.clientWidth;
        if (document.body)
            return document.body.clientWidth;
    }

    3.滚动到屏幕底部,执行一些操作 

    window.onscroll = function() {
        //获取被卷去高度
        var scrollTop = document.body.scrollTop;
        //获取窗口高度(可见区域高度)
        var windowHeight = document.documentElement.clientHeight;
        //获取文档高度
        var documentHeight = document.body.scrollHeight;
        if (scrollTop + windowHeight >= documentHeight) {
            $('#nomore').show();
            //发送Ajax请求获取分页数据
        }
    }

      说明:jQuery实现方式见文章-js与jQuery实现方式对比汇总

      

  • 相关阅读:
    axios express设置跨域允许传递cookie
    yarn常用命令指北
    Web代理工具NProxy
    DevOps的了解
    css图片hover放大
    autoprefixer
    谈谈浏览器http缓存
    欢迎使用 MWeb
    优化关键渲染路径CRP
    chrome 61 更新
  • 原文地址:https://www.cnblogs.com/Marydon20170307/p/7146875.html
Copyright © 2011-2022 走看看