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 相关文章推荐
iframe子页面获取父页面元素的方法
Nov 05 Javascript
jQuery 的全选(全非选)即取得被选中的值使用介绍
Nov 12 Javascript
js showModalDialog 弹出对话框的简单实例(子窗体)
Jan 07 Javascript
js出生日期 年月日级联菜单示例代码
Jan 10 Javascript
在JS中如何调用JSP中的变量
Jan 22 Javascript
jQuery模拟点击A标记示例参考
Apr 17 Javascript
利用Vue实现移动端图片轮播组件的方法实例
Aug 23 Javascript
AngularJS 的$timeout服务示例代码
Sep 21 Javascript
详解利用Angular实现多团队模块化SPA开发框架
Nov 27 Javascript
AngularJS实现动态切换样式的方法分析
Jun 26 Javascript
解决Vue @submit 提交后不刷新页面问题
Jul 18 Javascript
vue中可编辑树状表格的实现代码
Oct 31 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
同时提取多条新闻中的文本一例
2006/10/09 PHP
php的urlencode()URL编码函数浅析
2011/08/09 PHP
php实现批量下载百度云盘文件例子分享
2014/04/10 PHP
php判断两个日期之间相差多少个月份的方法
2015/06/18 PHP
浅谈PHP eval()函数定义和用法
2016/06/21 PHP
thinkphp5.1框架实现格式化mysql时间戳为日期的方式小结
2019/10/10 PHP
javascript实现促销倒计时+fixed固定在底部
2013/09/18 Javascript
jQuery中DOM树操作之使用反向插入方法实例分析
2015/01/23 Javascript
jQuery实现页面顶部显示的进度条效果完整实例
2015/12/09 Javascript
Angular中$compile源码分析
2016/01/28 Javascript
JS基于MSClass和setInterval实现ajax定时采集信息并滚动显示的方法
2016/04/18 Javascript
Javascript OOP之面向对象
2016/07/31 Javascript
用AngularJS的指令实现tabs切换效果
2016/08/31 Javascript
JS实现拖动滚动条评分的效果代码分享
2016/09/29 Javascript
js实现关闭网页出现是否离开提示
2017/12/07 Javascript
Vue v2.4中新增的$attrs及$listeners属性使用教程
2018/01/08 Javascript
详解VUE里子组件如何获取父组件动态变化的值
2018/12/26 Javascript
监听element-ui table滚动事件的方法
2019/03/26 Javascript
elementui之el-tebs浏览器卡死的问题和使用报错未注册问题
2019/07/06 Javascript
Node Express用法详解【安装、使用、路由、中间件、模板引擎等】
2020/05/13 Javascript
[01:31]完美与DOTA2历程
2014/07/31 DOTA
Python 列表list使用介绍
2014/11/30 Python
Python yield 使用方法浅析
2017/05/20 Python
Numpy ndarray 多维数组对象的使用
2021/02/10 Python
CSS3制作半透明边框(Facebox)类似渐变
2012/12/09 HTML / CSS
CSS3文本换行word-wrap解决英文文本超过固定宽度不换行
2013/10/10 HTML / CSS
Cinque网上商店:德国服装品牌
2019/03/17 全球购物
司机岗位职责
2013/11/15 职场文书
大三学生做职业规划:给未来找个方向
2014/02/24 职场文书
公司门卫工作职责
2014/06/28 职场文书
党的群众路线教育实践活动个人整改措施范文
2014/11/04 职场文书
2014年德育工作总结
2014/11/20 职场文书
社区重阳节活动总结
2015/03/24 职场文书
公司借条范本
2015/05/25 职场文书
2016机关干部作风建设心得体会
2016/01/21 职场文书
CSS3实现模糊背景的三种效果示例
2021/03/30 HTML / CSS