1.获取手指滑动的长度:

  1. var hasTouch = 'ontouchstart' in window && !isTouchPad,
  2. _start:function(e){
  3. var point = hasTouch ? e.touches[0] : e;
  4. startY = point.pageY;
  5. }
  6. _move:function(e){
  7. var point = hasTouch ? e.touches[0] : e;
  8. //offsetY就是手指滑动的垂直距离
  9. offsetY = point.pageY - startY;
  10. }

通过offsetY>0表示手指下拉,offsetY<0表示手指上拉。

h5移动端滑动的细节的更多相关文章

  1. H5移动端的注意细节

    1. max-width用在pc端页面,max-device-width用在移动设备上 2. device-pixel-ratio 设备像素比 3.设备自己单位-物理单位dp/dip css像素 px ...

  2. 移动端H5页面惯性滑动监听

    移动端H5页面惯性滑动监听 在移动端,当你快速滑动有滚动条的页面时,当你手指离开屏幕时,滚动条并不会立即停止,而是会随着"惯性"继续滑动一段距离. 在做项目的过程中,需要监听惯性滑 ...

  3. RE:通过移动端滑动手势实现数据加载

      背景:         基于要尝试的移动端项目需要有一个通过上拉下滑手势达成加载不同数据的功能,其涉及到滑动手势和ajax数据加载方面的知识点.故对整个实现过程做一个记录整理.个人JS功底有限,看 ...

  4. 基于SwiperJs的H5/移动端下拉刷新上拉加载更多的效果

    最早时,公司的H5项目中曾用过点击一个"加载更多"的DOM元素来实现分页的功能,后来又用过网上有人写的一个上拉加载更多的插件,那个插件是页面将要滚动到底部时就自动请求数据并插入到页 ...

  5. 基于SwiperJs的H5/移动端下拉刷新上拉加载更多

    最早时,公司的H5项目中曾用过点击一个"加载更多"的DOM元素来实现分页的功能,后来又用过网上有人写的一个上拉加载更多的插件,那个插件是页面将要滚动到底部时就自动请求数据并插入到页 ...

  6. 10天学会phpWeChat——第七天:创建一个自适应PC网站+H5移动端的模块

    本教程基于phpWeChat核心框架1.1.0+版本.下载地址:http://s.phpwechat.com/app_38026ed22fc1a91d92b5d2ef93540f20 通过前面六讲的系 ...

  7. H5移动端知识点总结

    H5移动端知识点总结 阅读目录 移动开发基本知识点 calc基本用法 box-sizing的理解及使用 理解display:box的布局 理解flex布局 Flex布局兼容知识点总结 回到顶部 移动开 ...

  8. 一个H5的3D滑动组件实现(兼容2D模式)

    起由 原始需求来源于一个项目的某个功能,要求实现3D图片轮播效果,而已有的组件大多是普通的2D图片轮播,于是重新造了一个轮子,实现了一个既支持2D,又支持3D的滑动.轮播组件. 实现思路 刚一开始肯定 ...

  9. 旅行app(游记、攻略、私人定制) | 顺便游旅行H5移动端实例

    <顺便游旅行>是一款H5移动端旅行app,提供目的地(国内.国外.周边)搜索.旅游攻略查询.游记分享.私人定制4大模块,类似携程.同程.去哪儿.马蜂窝移动端,只不过顺便游app界面更为简洁 ...

随机推荐

  1. Android Material Design 控件常用的属性

    android:fitsSystemWindows="true" 是一个boolean值的内部属性,让view可以根据系统窗口(如status bar)来调整自己的布局,如果值为t ...

  2. [转] ServletContext 与application的异同

    相同:其实servletContext和application 是一样的,就相当于一个类创建了两个不同名称的变量.在 servlet中ServletContext就是application对象.大家只 ...

  3. Jenkins_获取源码编译并启动服务(二)

    一.创建Maven项目   二.设置SVN信息   三.设置构建触发器   四.设置Maven命令   五.设置构建后发邮件信息(参考文章一) 六.设置构建后拷贝文件到远程机器并执行命令   来自为知 ...

  4. sql insert into select语句写法-将查询结果直接插入到表中

    insert into month_gpcj_info(idStr,zszrmygpsl,xyzrmygpsl,mycje,mycjl,month_date,dataCompiledDate) sel ...

  5. unittest测试驱动之HTMLTestRunner.py

    对于自动化来说,测试报告是必须的,在敏捷化的团队中,团队中的成员需要自动化这边提供自动化的测试报告,来判断系统的整体质量以及下一步的测试策略.单元测试库生成测试输出到控制台的窗口上,但是这样的结果看起 ...

  6. log4net在Asp.net Mvc中的应用配置与介绍

    log4net在.NET中的地位就不多言语了,此篇文章着重配置.较少介绍使用.因为在网上你可以在网上搜到几十万的文章告诉你怎么用.安装的话也不废话了,很简单.Nuget里搜索一下"log4n ...

  7. JAVA gc垃圾回收机制

    一.GC概要   JVM堆相关知识     为什么先说JVM堆?     JVM的堆是Java对象的活动空间,程序中的类的对象从中分配空间,其存储着正在运行着的应用程序用到的所有对象.这些对象的建立方 ...

  8. Leetcode 131. Palindrome Partitioning

    Given a string s, partition s such that every substring of the partition is a palindrome. Return all ...

  9. C# winform窗体设计-查询单个值

    查询单个值主要用于对成绩最低分,最高分,学生总数,学生性别等信息的统计 在查询单个值的时候用到了ExecuteScalar方法,连接以及语句方面,以及思路和对数据的增删改差不多 下面请看一段代码: s ...

  10. python图形界面(GUI)设计

    不要问我为什么要用 python 来做这种事,我回到“高兴咋地”也不是不可以,总之好奇有没有好的解决方案.逛了一圈下来,总体上来说,python 图形界面有以下几个可行度比较高的解决方案. 1. py ...