原生js获取和设置页面垂直滚动高度

最新推荐文章于 2024-04-20 01:21:40 发布

fairyIer

最新推荐文章于 2024-04-20 01:21:40 发布

阅读量1w

点赞数

分类专栏： JavaScript html 文章标签：原生js获取页面滚动高度原生js设置页面滚动高度

本文链接：https://blog.csdn.net/fairyier/article/details/80191451

版权

JavaScript 同时被 2 个专栏收录

42 篇文章 1 订阅

订阅专栏

html

18 篇文章 0 订阅

订阅专栏

最近想用原生js实现一些交互效果，以下代码是返回顶部按钮要用到的一个方法：获取和设置页面垂直滚动高度，如果用jq可以简单实现，用原生js，其实就是要多考虑浏览器的兼容性：

/**
     * 获取&&设置-页面垂直滚动值
     * */
    function __getPageScrollY(top) {

        if (top || Number(top) == 0) { //设置垂直滚动值
            if (self.pageYOffset) {
                self.pageYOffset = Number(top);
            }
            if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict
                document.documentElement.scrollTop = Number(top);
            }
            if (document.body) {// all other Explorers
                document.body.scrollTop = Number(top);
            }
            return true;
        } else { //获取垂直滚动值
            var yScroll;
            if (self.pageYOffset) {
                yScroll = self.pageYOffset;
            } else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict
                yScroll = document.documentElement.scrollTop;
            } else if (document.body) {// all other Explorers
                yScroll = document.body.scrollTop;
            }
            return yScroll;
        }

    };

调用：

var scrollHeight = __getPageScrollY();//获取高度
    __getPageScrollY(1000);//设置高度