时间：2019/10/20
8.PC端网页特效
1).元素偏移量offset系列（动态得到该元素的偏移、大小等）
1.常用属性：
element.offsetTop; // 返回元素相对带有定位父元素的偏移
element.offsetLeft;
element.offsetWidth; // 返回元素当前宽度和高度（border-box盒模型）
element.offsetHeight;
element.offsetParent; // 返回带有定位的父元素
//offset是只读属性，用于获取元素大小位置信息；style可读写，用于改变元素大小位置
2.模态框移动案例思路：
模态框移动案例.jpg
3.图片放大镜效果案例思路：
功能分析.jpg
显示隐藏.jpg
遮挡层移动.jpg
大图移动.jpg
2).元素可视区client系列
element.clientWidth; // 返回元素当前宽度和高度（不包含边框）
element.clientHeight;
document.documentElement.clientHeight; // 屏幕可视区高度
element.clientTop; // 返回元素边框大小
element.clientLeft;
PS：立即执行函数
// 立即执行函数最大的作用是独立创建了一个作用域，内部变量都为局部变量，避免命名冲突
(function() {})()
(function() {}())
3).元素滚动scroll系列（动态得到元素的大小，滚动距离等）
element.scrollTop; // 返回被卷去的距离（滚动时超出可视区的宽高度，即滚动距离）
element.scrollLeft;
window.pageYOffset; // 页面被卷去的距离（即滚动距离），IE9
document.documentElement.scrollTop; // 页面被卷去的距离
window.pageXOffset;
element.scrollWidth; // 返回自身内容实际的宽高度，不含边框
element.scrollHeight;
scroll; // 滚动事件
PS：position中absolute不是可视区距离定位；fixed是可视区距离定位。
1.固定侧边栏案例思路：
功能介绍.jpg
流程分析.jpg
4).三大系列总结
总结1.jpg
总结2.jpg
