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

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

通过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. [Google Guava]学习--缓存cache

    适用性 缓存在很多情况下非常实用.例如,计算或检索一个值的代价很高,并且对同样的输入需要不止一次获取值的时候,就应当考虑使用缓存. Guava Cache与ConcurrentMap很相似,但也不完全 ...

  2. IOS APP开发中View的几种实现方式

    xib文件有以下几个重要的属性: xib文件名 File’s Owner xib文件中的视图的Class xib文件中的视图的Outlet指向 File’s Owner 可以关联到某类,然后通过IBO ...

  3. js-读取系统时间

    转载 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.o ...

  4. 使用redis避免客户端频繁提交数据

    避免客户端频繁向服务器提交表单的解决方案 使用redis 在order的model中增加函数 ) { try{ $key = "lock_" . $key; $num = $thi ...

  5. wamp服务下部署禅道或其它项目时访问缓慢的解决办法

    原因其实很简单: WAMP服务默认是不支持外网访问的,如果公司内外网在一起就会引起缓慢甚至超时的问题,直接修改WAPM的配置文件让它可以访问外网即可解决问题.   解决的方法/步骤   1.解决办法: ...

  6. 【BZOJ-3165】Segment 李超线段树(标记永久化)

    3165: [Heoi2013]Segment Time Limit: 40 Sec  Memory Limit: 256 MBSubmit: 368  Solved: 148[Submit][Sta ...

  7. javascript要不要用来处理业务逻辑

    这个问题,我现在才明白该怎样描述这个已经困惑了我很久的问题,在公司做的项目中,js对于数据验证起到了很大的作用,但是这使得整个项目的业务逻辑变得零散,甚至混乱 现在公司里的项目就是这样的.现在再想想, ...

  8. Linux-小命令技巧

    在bash中检查远程端口是否打开:echo >/dev/tcp/8.8.8.8./53 && echo "open"将进程挂起ctrl+z,不是万能的,有程序 ...

  9. Joblogs——ContentValues的使用

    ContentValues在Android的SQLiteDatabase.update (String table, ContentValues values, String whereClause, ...

  10. matlab从txt文本导入数据作图

    Matlab上 fr = fopen('d:\Matlab\长期纪录2014-3-11.txt', 'r');data=fscanf(fr,'%f',[1,inf]);axis([0 90000 -8 ...