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 相关文章推荐
JavaScript 获取事件对象的注意点
Jul 29 Javascript
javascript &&和||运算法的另类使用技巧
Nov 28 Javascript
javascript prototype原型操作笔记
Dec 07 Javascript
用js格式化金额可设置保留的小数位数
May 09 Javascript
对new functionName()定义一个函数的理解
May 22 Javascript
jquery处理json数据实例分析
Jun 03 Javascript
微信小程序五星评分效果实现代码
Apr 06 Javascript
JS设计模式之数据访问对象模式的实例讲解
Sep 30 Javascript
layui 表格的属性的显示转换方法
Aug 14 Javascript
Android 自定义view仿微信相机单击拍照长按录视频按钮
Jul 19 Javascript
mpvue微信小程序的接口请求fly全局拦截代码实例
Nov 13 Javascript
vue 自定义组件的写法与用法详解
Mar 04 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 5.0对象模型深度探索之类的静态成员
2008/03/27 PHP
PHP 防注入函数(格式化数据)
2011/08/08 PHP
PHP调用Linux的命令行执行文件压缩命令
2013/01/27 PHP
php5.3 goto函数介绍和示例
2014/03/21 PHP
PHP 实现从数据库导出到.csv文件方法
2017/07/06 PHP
thinkPHP5.0框架验证码调用及点击图片刷新简单实现方法
2018/09/07 PHP
解决laravel id非自增 模型取回为0 的问题
2019/10/11 PHP
JavaScript和JQuery实用代码片段(一)
2010/04/07 Javascript
ExtJS4 动态生成的grid导出为excel示例
2014/05/02 Javascript
详谈javascript中DOM的基本属性
2015/02/26 Javascript
IE6兼容透明背景图片及解决方案
2015/08/19 Javascript
使用jQuery制作基础的Web图片轮播效果
2016/04/22 Javascript
基于JS实现导航条flash导航条
2016/06/17 Javascript
原生JS:Date对象全面解析
2016/09/06 Javascript
js中获取键盘事件的简单实现方法
2016/10/10 Javascript
xcode中获取js文件的路径方法(推荐)
2016/11/05 Javascript
使用JavaScript触发过渡效果的方法
2017/01/19 Javascript
Node.js中流(stream)的使用方法示例
2017/07/16 Javascript
[43:33]EG vs Spirit Supermajor 败者组 BO3 第一场 6.4
2018/06/05 DOTA
python下如何让web元素的生成更简单的分析
2008/07/17 Python
Python3中常用的处理时间和实现定时任务的方法的介绍
2015/04/07 Python
Python中逗号的三种作用实例分析
2015/06/08 Python
Python3实现发送QQ邮件功能(文本)
2017/12/15 Python
用python脚本24小时刷浏览器的访问量方法
2018/12/07 Python
详解python-图像处理(映射变换)
2019/03/22 Python
Python绘制三角函数图(sin\cos\tan)并标注特定范围的例子
2019/12/04 Python
Python如何使用OS模块调用cmd
2020/02/27 Python
Python如何使用vars返回对象的属性列表
2020/10/17 Python
CSS3制作精致的照片墙特效
2016/06/07 HTML / CSS
css3 线性渐变和径向渐变示例附图
2014/04/08 HTML / CSS
历史学专业大学生找工作的自我评价
2013/10/16 职场文书
公司委托书格式范文
2014/04/04 职场文书
群众路线学习笔记范文
2014/11/06 职场文书
员工评语范文
2014/12/31 职场文书
感谢信怎么写
2015/01/21 职场文书
Java9新特性之Module模块化编程示例演绎
2022/03/16 Java/Android