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.scrollTopvar scroll = scrollTop - this.i;this.i = scrollTop;if(scroll<0){console.log('up')}else{console.log('down')}},},beforeDestroy() {window.removeEventListener('scroll', this.handleScroll, true); },}
</script>

vue 判断鼠标上下滚动相关推荐

判断鼠标滑轮滚动事件
windowAddMouseWheel() {let that = thislet scrollFunc = function (e) {e = e || window.eventif (e.whee ...
鼠标滑轮滚动事件（记录下以后用到好找）
//兼容性写法,该函数也是网上别人写的,不过找不到出处了,蛮好的,所有我也没有必要修改了 //判断鼠标滚轮滚动方向 if (window.addEventListener)//FF,火狐浏览器会识别该 ...
php向下滑动,js如何判断鼠标滚轮是向下还是向上滚动
判断鼠标滚轮是向上或向下滚动,不同的浏览器的判别方式是不一样的,当前比较流行的浏览器有 IE,Opera,Safari,Firefox,Chrome,在这个问题上Firefox和其他浏览器的实现方式是 ...
js判断鼠标滚动放下，向上滚还是向下滚？
js判断鼠标滚动放下,向上滚还是向下滚? demo: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&quo ...
vue 组件封装 | s-fullpage 全屏滚动（内含绑定鼠标滑轮滚动事件、避免鼠标滑轮连续滚动、滑动过渡动画等实用技巧）
目录目标实现原理(要点) 完整代码 s-fullpage 和 s-fullpageItem s-fullpage.vue s-fullpageItem.vue 使用范例范例效果目标实现类似插 ...
Vue项目判断鼠标点击事件的左键、中键（滚轮）或右键
Vue项目判断鼠标点击事件的左键.中键(滚轮)或右键去掉特定区域的右键点击事件在需要去掉右键点击事件的区域最外层div标签中添加@contextmenu.prevent属性 <templat ...
js判断鼠标靠近屏幕最侧面的监听_threejs按鼠标位置缩放场景
threejs的orbitcontrol,默认的缩放模式为整体以target为中心进行缩放.有时候,我们想让场景按照鼠标位置进行缩放,体验起来就和地图的缩放一样,最直观的感觉就是整个场景会越来越靠近鼠 ...
js/jq判断鼠标滚轮方向
js判断鼠标滚轮方向: var scrollFunc = function (e) { e = e || window.event; if (e.wheelDelta) { //判断浏览器IE,谷歌滑 ...
vue 实现 web端滚动刷新自定义指令
vue 实现 web端滚动刷新想实现web端的滚动刷新,我们需要判断滚动已经到达最低部,利用addEventListener监听滚动高度,触发相应的回调函数,激发加载更多数据,那么我们该怎样计算滚动 ...

vue 判断鼠标上下滚动

vue 判断鼠标上下滚动相关推荐

最新文章

热门文章