需求背景 在开发过程中，经常遇到用户提出 如果某个内容没有填写，则需要弹出提示，并且将页面滚动到指定位置的需求。那这种情况应该怎么实现呢？具体代码如下： 一、给链接a加个#的方式来实现跳转。 div1 div2 div3 <div id="container"> <a href="#div1">di ...
分类：
Web程序 时间：
2020-11-21 12:27:15
阅读次数：
21
原理：就是监听页面滚动事件，分析clientHeight、scrollTop、scrollHeight三者的属性关系。 window.addEventListener('scroll', function() { const clientHeight = document.documentEleme ...
分类：
Web程序 时间：
2020-11-10 11:04:36
阅读次数：
17
首先理解三个dom元素，分别是：clientHeight、offsetHeight、scrollTop。 clientHeight：这个元素的高度，占用整个空间的高度，所以，如果一个div有滚动条，那个这个高度则是不包括滚动条没显示出来的下面部分的内容。而只是单纯的DIV的高度。 offsetHei ...
分类：
Web程序 时间：
2020-11-10 10:32:09
阅读次数：
14
文档上卷的距离+窗口的高度=文档的距离 就可以说到底了 但是我们往往在还未到低时候就开始加载下一页 //添加窗口滚动事件 window.onscroll = () => { //上卷距离 let st = document.documentElement.scrollTop || document. ...
分类：
其他好文 时间：
2020-11-01 21:35:08
阅读次数：
21
我们以往实现平滑滚动往往用的是jQuery, 如实现平滑回到顶部，就写如下代码： $(‘.js_go_to_top‘).click(function () { $(".js_scroll_area").animate({scrollTop: 0}, 600); }); 我们现在可能通过css实现这一 ...
分类：
Web程序 时间：
2020-07-19 00:35:24
阅读次数：
142
$(window).scroll(function(){ var S = document.body.scrollTop || document.documentElement.scrollTop; if(S >= 2000){ $(".up").css({"display":"block"}); ...
分类：
Web程序 时间：
2020-07-14 13:14:23
阅读次数：
71
y开始使用的解决方案是使用聚堆定位，在onShow中获取元素距离顶部的距离，然后监听页面滚动，当滚动的距离大于距离顶部的距离时就让他绝对定位 Page({ data: { // 区域里顶部的距离吧 fixTop: 0, // 滚动的距离 scrollTop: 0, isFixed: false }, ...
分类：
微信 时间：
2020-07-13 12:04:50
阅读次数：
201
1、查看滚动条的滚动距离 （1） IE9以下不兼容 window.pageXOffset：查看滚动条水平方向滚动的距离 window.pageYOffset：查看滚动条垂直方向滚动的距离 （2） document.body/documentElement.scrollLeft/scrollTop 兼 ...
分类：
其他好文 时间：
2020-07-12 10:37:16
阅读次数：
76
摘要：elememt-ui中使用el-scrollbar时监听scroll事件，处理el-tabs滚动到顶部时header部分吸顶效果 前言 网上关于el-scrollbar滚动事件监听的案例比较少，好不容易找到解决方法，记录一下，启发之处在这里，稍有改动 在vue中使用elememt-ui时，如果 ...
分类：
其他好文 时间：
2020-07-11 15:39:36
阅读次数：
237
搞清clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop 网页可见区域高：document.body.clientHeight 网页正文全文高：document.body.scrollHeight网页可见区域高（包括边线的高）：docu ...
分类：
其他好文 时间：
2020-07-11 12:36:10
阅读次数：
56
