vue移动端监听滚动条高度的实现方法


Posted in Javascript onSeptember 03, 2018

这两天做移动端项目遇到的问题,就是当滚动条下拉到一定的高度的时候,让某个东西固定定位到顶部

首先做的如何监听滚动条的高度,下面是我写的方法

var _this =this
window.addEventListener('scroll',function(){
 var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
 if(scrollTop>100{//滚动条的高度,可以动态获取也可以写死
  //这里写要执行的操作
_this.gofixed = false

console.log(1); }else{ _this.gofixed = true }},true)我的这个方法是应用v-bind:class 来添加一个类 名

gofixed

是判断的变量

以上这篇vue移动端监听滚动条高度的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
使用JQUERY Tabs插件宿主IFRAMES
Jan 01 Javascript
用jquery实现自定义风格的滑动条实现代码
Apr 26 Javascript
分享9个最好用的JavaScript开发工具和代码编辑器
Mar 24 Javascript
jquery中validate与form插件提交的方式小结
Mar 26 Javascript
基于BootStrap Metronic开发框架经验小结【二】列表分页处理和插件JSTree的使用
May 12 Javascript
js判断价格,必须为数字且不能为负数的实现方法
Oct 07 Javascript
JavaScript对象引用与赋值实例详解
Mar 15 Javascript
在iframe中使bootstrap的模态框在父页面弹出问题
Aug 07 Javascript
详解a++和++a的区别
Aug 30 Javascript
老生常谈JavaScript面向对象基础与this指向问题
Oct 16 Javascript
ES6的异步操作之promise用法和async函数的具体使用
Dec 06 Javascript
输入框跟随文字内容适配宽实现示例
Aug 14 Javascript
vue 纯js监听滚动条到底部的实例讲解
Sep 03 #Javascript
解决vue.js this.$router.push无效的问题
Sep 03 #Javascript
JavaScript封装的常用工具类库bee.js用法详解【经典类库】
Sep 03 #Javascript
基于vue-router 多级路由redirect 重定向的问题
Sep 03 #Javascript
vue-cli 引入jQuery,Bootstrap,popper的方法
Sep 03 #jQuery
Vue-router的使用和出现空白页,路由对象属性详解
Sep 03 #Javascript
Vue 通过自定义指令回顾v-内置指令(小结)
Sep 03 #Javascript
You might like
php快速url重写更新版[需php 5.30以上]
2010/04/25 PHP
解析php中的escape函数
2013/06/29 PHP
PHP中$_SERVER的详细参数与说明介绍
2013/10/26 PHP
PHP使用xmllint命令处理xml与html的方法
2014/12/15 PHP
PHP实现的构造sql语句类实例
2016/02/03 PHP
Laravel Eloquent ORM 多条件查询的例子
2019/10/10 PHP
js变量作用域及可访问性的探讨
2006/11/23 Javascript
How to Auto Include a Javascript File
2007/02/02 Javascript
仅用[]()+!等符号就足以实现几乎任意Javascript代码
2010/03/01 Javascript
js字符编码函数区别分析
2011/12/28 Javascript
轻量级javascript 框架Backbone使用指南
2015/07/24 Javascript
JS表格组件神器bootstrap table详解(基础版)
2015/12/08 Javascript
Jquery跨浏览器文本复制插件Zero Clipboard的使用方法
2016/02/28 Javascript
jQuery中使用animate自定义动画的方法
2016/05/29 Javascript
JavaScript实现横线提示输入验证码随输入验证码输入消失的方法
2016/09/24 Javascript
jQuery继承extend用法详解
2016/10/10 Javascript
Vue keepAlive 数据缓存工具实现返回上一个页面浏览的位置
2019/05/10 Javascript
JS数组转字符串实现方法解析
2020/09/04 Javascript
JS闭包原理及其使用场景解析
2020/12/03 Javascript
Python类的用法实例浅析
2015/05/27 Python
在Django中管理Users和Permissions以及Groups的方法
2015/07/23 Python
python实现批量按比例缩放图片效果
2018/03/30 Python
matplotlib subplots 设置总图的标题方法
2018/05/25 Python
Python实现爬虫抓取与读写、追加到excel文件操作示例
2018/06/27 Python
pycharm使用matplotlib.pyplot不显示图形的解决方法
2018/10/28 Python
python实现邮件发送功能
2019/08/10 Python
python django生成迁移文件的实例
2019/08/31 Python
Python基于requests库爬取网站信息
2020/03/02 Python
OpenCV4.1.0+VS2017环境配置的方法步骤
2020/07/09 Python
python 实现控制鼠标键盘
2020/11/27 Python
几款主流好用的富文本编辑器(所见即所得常用编辑器)介绍
2021/03/17 Javascript
网络艺术零售业的先驱者:artrepublic
2017/09/26 全球购物
建筑横幅标语
2014/10/09 职场文书
2016毕业实习单位评语大全
2015/12/01 职场文书
vue+element ui实现锚点定位
2021/06/29 Vue.js
vue中div禁止点击事件的实现
2022/04/02 Vue.js