获取页面各种大小

1：可见范围

描述：获取当前页面的可见大小，其大小是动态的，若是窗体最小化，或者缩小什么的，可见宽高也会变化

//页面可见大小
var clientWidth = document.body.clientWidth;
var clienHeight = document.body.clientHeight;

 

2：滚动距离

描述：获取当前页面上下左右滚动距离，不过这里是有坑的，因为在谷歌或者IE11等新一代的浏览器中，滚动距离比较严格，若是该滚动条，不是在整个页面上，即document上的话，可能通过方式一获取到的值，会一直为0，而是在页面的某个dom上，那么就用方式二；

方式一：

var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
var scrollLeft = document.body.scrollLeft || document.documentElement.scrollLeft;

方式二：

var scrollTop = $(this).scrollTop();
var scrollLeft = $(this).scrollLeft();

3：获取当前浏览器大小（浏览器放大或者缩小，都能动态获取）

var height = window.outerHeight
var width = window.outerWidth;

 

 

内容参考（非常感谢该博主的分享）

HTML 获取屏幕、浏览器、页面的高度宽度