笔记系列之——页面滚动时，即时获取离可视区顶部最近的元素

作者: 临安linan | 来源:发表于2019-03-31 17:05 被阅读0次

笔记系列之——页面滚动时，即时获取离可视区顶部最近的元素
锚点链接实现
jquery尺寸相关，滚动事件
一些好用的代码
获取宽高、加载（DOM）、currentStyle、getCom
js宽高的加载关系
windows / document
尺寸相关、滚动事件
小程序滚动吸顶，粘性布局
2020-05-16 Flutter SliverPersist

给需要进行比较判断的元素标签上加上特殊属性（eg.tag）
let tag = document.querySelectorAll("[tag]");
监听滚动事件

// (xxx.getBoundingClientRect().top) 可以获取元素距离可视区顶部的距离
window.onscroll = function () {
  let index = 0;
  for (let i = 0; i < tag.length; i++) {
    if (Math.abs(tag[i].getBoundingClientRect().top) < Math.abs(tag[index].getBoundingClientRect().top)){
      index = i;
    }
  }
// tag[i]就是所找的元素
}

笔记系列之——页面滚动时，即时获取离可视区顶部最近的元素
给需要进行比较判断的元素标签上加上特殊属性（eg.tag） let tag = document.querySel...
锚点链接实现
用到onpagescroll方法获取页面的滚动高度和获取元素距离页面顶部的高度。
jquery尺寸相关，滚动事件
获取和设置元素的尺寸获取元素相对页面的绝对位置获取浏览器可视区宽度高度获取页面文档的宽度高度获取页面滚动距...
一些好用的代码
隐藏所有指定的元素检查元素是否具有指定的类如何切换一个元素的类? 获取当前页面的滚动位置平滑滚动到页面顶部 ...
获取宽高、加载（DOM）、currentStyle、getCom
鼠标在可视区中的坐标获取可视区宽高获取滚动距离获取内容宽高获取盒子模型宽高获取元素的相对位置获取元素的...
js宽高的加载关系
1可视区域加载>第2屏加载 2页面滚动到顶部和底部按需加载image.png 3 div元素image.png ...
windows / document
一、Windows 浏览器窗口二、Docment 文档可视区域加载页面滚动到顶部/底部 div滚动到底部/顶...
尺寸相关、滚动事件
1、获取和设置元素的尺寸 2、获取元素相对页面的绝对位置 .offset()3、获取可视区高度 4、获取页面高度 ...
小程序滚动吸顶，粘性布局
当指定容器滚动到顶部时，让他粘在顶部，离开时跟随页面滚动（不使用页面滚动事件） 1、准备工作 WXML WXSS ...
2020-05-16 Flutter SliverPersist
SliverPersistentHeader是在CustomScrollView中需要在滚动中固定在页面顶部的元素...