vue 中判断向上滚动还是向下滚动
- <script>
- export default {
- data(){
- return{
- i = 0
- }
- },
- mounted () {
- window.addEventListener('scroll', this.handleScroll, true);
- // 监听(绑定)滚轮 滚动事件
- },
- methods:{
- handleScroll(){
- // 页面滚动距顶部距离
- var scrollTop = window.pageYOffset || document.documentElement.scrollTop ||
- document.body.scrollTop
- var scroll = scrollTop - this.i;
- this.i = scrollTop;
- if(scroll<0){
- console.log('up')
- }else{
- console.log('down')
- }
- },
- }
vue 中判断向上滚动还是向下滚动的更多相关文章
- JS判断鼠标向上滚动还是向下滚动
js如何判断滚轮的上下滚动,我们应该都见到过这种效果,用鼠标滚轮实现某个表单内的数字向上滚动就增加,向下滚动就减少的操作,这种效果是通过js对鼠标滚轮的事件监听来实现的.今天简单的研究了一下如何使用j ...
- js-scroll判断页面是向上滚动还是向下滚动
原理:那当前的scrollTop和之前的scrollTop对比 如果变大了,表示向下滚动(scrollTop值变大): 如果变小了,表示向上滚动(scrollTop值变小). 方法一:js代码: $( ...
- vue中判断页面滚动开始和结束
参考链接:https://www.jianshu.com/p/adad39705ced 和 https://blog.csdn.net/weixin_44309374/article/deta ...
- 向上滚动或者向下滚动分页异步加载数据(Ajax + lazyload)[上拉加载组件]
/**** desc : 分页异步获取列表数据,页面向上滚动时候加载前面页码,向下滚动时加载后面页码 ajaxdata_url ajax异步的URL 如data.php page_val_name a ...
- C++中的向上类型转换和向下类型转换
在c++的世界中有这样两个概念,向上类型转换,向下类型转换,分别描述的是子类向基类,和基类向子类的强制类型转换. 向上强制类型转换 切割:覆盖方法和子类数据丢失的现象生成切割(slice) class ...
- Java中的向上转型和向下转型
首先要明白一点向上转型和向下转型他们都是建立在继承的基础上. 一.向上转型 子类到父类的转换通常称作向上转型,通俗的说就是定义父类对象指向子类对象. 下面通过一个例子来深入理解向上转型. //定义一个 ...
- 3.sql中的向上递归和向下递归
1.向下递归 select * from table_name where 条件 connect by prior bmbm(本级关联条件)=sjbmbm(上级关联条件) start with bmb ...
- jq判断鼠标滚轴向上滚动还是向下滚动
$(document).on("mousewheel DOMMouseScroll", function (e) { var delta = (e.originalEvent.wh ...
- Java中的向上造型和向下造型等
package com.study.oop.day01; /** * 如果某个方法是静态 的,它的行为就不具有多态性 * @author LuHongGang * @date 2017年6月5日 ...
随机推荐
- WPF 利用RichTextBox 打印出不同颜色的文本
using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows ...
- 洛谷P1850 换教室_数学期望_Floyd
调了一下午QAQ-让我对数学期望的理解又提升了一个层次. 首先,我们发现 v<=300v<=300v<=300 , 这样我们就可以用 FloydFloydFloyd 算法来 O(n3 ...
- elasticsearch批量操作
1.批量查询的好处 就是一条一条的查询,比如说要查询100条数据,那么就要发送100次网络请求,这个开销还是很大的 如果进行批量查询的话,查询100条数据,就只要发送1次网络请求,网络请求的性能开销缩 ...
- `itchat`配置代理
config.py配置 首先,先找到itchat安装的目录,然后定位到config.py文件: import os, platform VERSION = '1.3.10' BASE_URL = 'h ...
- Project Euler 32 Pandigital products
题意:找出所有形如 39 × 186 = 7254 这种,由 1 - 9,9个数字构成的等式的和,注意相同的积不计算两次 思路:如下面两种方法 方法一:暴力枚举间断点 /*************** ...
- mysql 插入更新在一条sql ON DUPLICATE KEY UPDATE
有时候需要进行数据操作的,如果有数据则更新数据, 没有数据则插入. 以往的做法是先查询,再根据查询结果进行判断,执行插入或更新操作 其实 有一种 ON DUPLICATE KEY UPDATE 语法, ...
- 数据库连接池和connection的理解
数据库连接池Data Source Pool的理解 1.数据库连接池允许应用程序重复使用一个现有的数据库连接,而不是再重新建立一个连接,避免了每个方法里new connection的耗费资源和时间. ...
- springMVC3.0(文件上传,@RequestMapping加參数,@SessionAttributes,@ModelAttribute,转发,重定向,数值获取,传參,ajax,拦截器)
1.项目包结构例如以下: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdG90b3R1enVvcXVhbg==/font/5a6L5L2T/fontsiz ...
- 抓包函数-pcap_next
抓包函数 pcap_next_ex, pcap_next 抓包 #include <pcap/pcap.h> int pcap_next_ex(pcap_t *p, s ...
- hdu2688 Rotate(树状数组)
题目链接:pid=2688">点击打开链接 题意描写叙述:对一个长度为2<=n<=3000000的数组,求数组中有序对(i<j而且F[i]<F[j])的数量?其 ...