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. android开机自启动广播

    权限<uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>     &l ...

  2. Android中图片的处理(放大缩小,去色,转换格式,增加水印等)(转)

    原文地址:http://menxu.lofter.com/post/164b9d_3ebf79 package com.teamkn.base.utils; import java.io.ByteAr ...

  3. JVM垃圾收集器介绍

    垃圾回收算法是GC的方法论,垃圾收集器就是内存回收的具体实现. 一.Serial 收集器 单线程收集器,在进行GC时,必须暂停所有的工作线程(Stop The World),直到GC收集结束. 缺点: ...

  4. Web前端性能优化教程09:图像和Cookie优化

    本文是Web前端性能优化系列文章中的第九篇,主要讲述内容:图像和Cookie优化.完整教程可查看:  一. 图像优化 图像基础知识 gif: 适用于动画效果,例如提示的滚动条图案 jpg: 是一种使用 ...

  5. 解决jQuery UI 对话框兼容性问题

    默认情况下使用jQuery UI的对话框,在Chrome浏览器是没问题的,但是在IE里却会显示对话框,用户体验非常不好.改变一下div的属性即可. 原本是这样: <div id="di ...

  6. GC基本算法及C++GC机制

    前言 垃圾收集器是一种动态存储分配器,它自动释放程序不再需要的已分配的块,这些块也称为垃圾.在程序员看来,垃圾就是不再被引用的对象.自动回收垃圾的过程则称为垃圾收集(garbage collectio ...

  7. 【BZOJ-1500】维修数列 Splay

    1500: [NOI2005]维修数列 Time Limit: 10 Sec  Memory Limit: 64 MBSubmit: 11047  Solved: 3460[Submit][Statu ...

  8. Nuget包里的依赖包更新到最新版本会不会随主包回滚到旧包的研究

    A包中有几个依赖包:A-1包,版本:>=1.0:但是我项目上已经引用了A-1包的2.0版本,那么我添加A包的时候,不会将A-1包2.0版本改成1.0版本,会直接用2.0版本的.

  9. git恢复误删文件及省去密码提交

    自己遇到这种情况:自己将某文件在网页的控制面板上直接删除了,再pull下来.或者一个成员误删除了某个文件,然后push到远程库了,其他成员也都pull了,结果就是所有人的本地库当前版本中这个文件都不见 ...

  10. MyCCL特征码定位原理学习

    这段时间学习WEB方面的技术,遇到了木马免杀特征码定位的问题,这里做一下学习笔记. 这里对MyCCL的分块原理做一下探究 对指定文件生成10个切块 对指定的木马进行切块后,文件列表是这样的. 注意这里 ...