很多朋友对于touchmove 谷歌浏览器和谷歌浏览器手里不太懂，今天就由小编来为大家分享，希望可以帮助到大家，下面一起来看看吧！

本文目录

1. 如何解决这个关于touchmove与touchstart事件问题
2. swiper android怎么使用
3. scroll、touchmove性能优化技巧

一、如何解决这个关于touchmove与touchstart事件问题

1.结合两者，但做一个标志，这样的函数只触发一次，每100毫秒左右。var flag= false;

$thing.bind('touchstart click', function(){

setTimeout(function(){ flag= false;}, 100);

2.你可以尝试这样的：var clickEventType=((document.ontouchstart!==null)?'click':'touchstart');

$("#mylink").bind(clickEventType, myClickHandler);

3.这是我“创造”，并拿出GhostClick和FastClick修复。试试在你自己的，并知道它的工作适合你。$(document).on('touchstart click','.myBtn' function(event){

4.通常这个工程，以及：$('#buttonId').on('touchstart click', function(e){

e.stopPropagation(); e.preventDefault();

5.余由以下方法。易Peasy...$(this).bind('touchstart click', function(){

6.检查快速按键和点击CHOST从谷歌

7.一般来说，你不想混了默认的触摸和非触摸（点击）API.a旦你进入触摸的世界更容易只与触摸相关的功能处理。下面是伪代码，会做你想要它。如果你在的TouchMove事件连接和跟踪的位置，您可以添加在doTouchLogic功能更多的项目来检测手势和诸如此类的东西。var touchStartTime;

$thing.bind('touchstart'), funcion(){

touchStartLocation= mouse.location(x,y);

$thing.bind('touchend'), funcion(){

touchEndLocation= mouse.location(x,y);

var distance= touchEndLocation- touchStartLocation;

var duration= touchEndTime- touchStartTime;

if(duration<= 100ms&& distance<= 10px){

// Person tapped their finger(do click/tap stuff here)

if(duration> 100ms&& distance<= 10px){

// Person pressed their finger(not a quick tap)

if(duration<= 100ms&& distance> 10px){

// Person flicked their finger

if(duration> 100ms&& distance> 10px){

// Person dragged their finger

8.另一个更好的维护。然而，该技术也将做event.stopPropagation（）。点击是没有抓到任何其他的点击为100ms。var clickObject={

var wasClicked= clickObject.flag;

setTimeout(function(){ clickObject.flag= false;}, 100);

$("#myButton").bind("click touchstart", function(event){

if(!clickObject.isAlreadyClicked()){

9.我写了一个jQuery插件，它提供了一个“touchclick”事件，你可以听。这需要避免被解雇两次都支持双方的点击和touchstart事件时，事件的照顾。

10.只为目的，这里就是我的最快/最敏感的点击桌面/ TAP解决方案，我能想到的做：我换成jQuery的on功能与修改一个，只要浏览器支持触摸事件，全部换成我的点击事件与touchstart。$.fn.extend({ _on:(function(){ return$.fn.on;})()});

var isTouchSupported='ontouchstart' in window|| window.DocumentTouch&& document instanceof DocumentTouch;

return function( types, selector, data, fn, one){

if(typeof types=='string'&& isTouchSupported&&!(types.match(/touch/gi))) types= types.replace(/click/gi,'touchstart');

return this._on( types, selector, data, fn);

用法比将有确切像以前一样：$('#my-button').on('click', function(){/*...*/});

但touchstart时可用，点击时不会。需要的任何种类的任何延误：D

11.我也工作在Android/ iPad的Web应用程序，它看来，如果“会连续”，就足以“（无需touchstart）。。通过禁用touchstart，单击（）;从jQuery的。它的实际工作还没有被touchstart超载。最后，您可以BINB生活。（“touchstart”功能（E）{e.stopPropagation（）;}）;要求touchstart事件停止传播，客厅点击（）来获取触发。它的工作

12.有很多事情试图解决这一问题时要考虑的。大多数解决方案要么打破滚动或不办理鬼单击事件正常。对于一个完整的解决方案，请参阅注意：你不能处理好鬼click事件每个基础。延迟的点击是通过屏幕位置发射，所以如果你的触摸事件修改页面的方式，单击事件将被发送到该页面的新版本。

13.相反，你一个计数器：var count= 0;

$thing.bind('touchstart click', function(){

if(count%2== 0){//count 2% gives the remaining counts when devided by 2

14.它可以有效地分配给该事件'touchstart mousedown'或'touchend mouseup'以避免不希望的副作用click。

15.考虑一个事实，即点击将始终遵循一个触摸事件的优势，这里是我做的，无需或全局标志摆脱“鬼点击”的。$('#buttonId').on('touchstart click', function(event){

$(this).data("already", false);

} else if(event.type=="touchstart"){

$(this).data("already", true);

基本上，每当ontouchstart上一个标志一组并随后删除（忽略）事件触发，当点击

二、swiper android怎么使用

Swiper默认提供1:1的触控距离，当然，这个比率是可以设置的。（touchRatio）

这个功能对于开发桌面网站会很有用。简单来说，就是因为Swiper能够让鼠标事件表现得像触屏事件（点击以及拖曳滑块）

Swiper运动主要有两种模式，horizontal(水平滑动)以及vertical（垂直运动的滑动）

这种模式下能够让slides无需定位，就像通常的滑动条。（看下面的例子）

5、旋转调整（rotation/resize）

Swiper在移动设备旋转后能自适应尺寸。

能使用百分比的宽高定义slides,为移动端提供不同的解决方案。

简单来说，就是，只能使用一种模式，水平或者垂直滑动。

8、抵抗反弹（resistant bounds）

Swiper能够提供一种机制，就是当滑动滑块超过最左以及最右（最上或最下）的位置时触发的一种抵御机制。

9、原生要素（native momentum）

有不少的原生东西提供给Swiper。

Swiper能够快速生成内建的分页控制（pagination）,指定html某一标签为pagination，Swiper就能做很多东西了。

只用设置延迟时间，Swiper就会自动地轮播slides直到你触碰该滑块（touch）为止。

该种模式下，你能够无限滑动滑块，到最后一个之后会跳转回第一个。

Swiper能够让你在slides父容器下设置你所需要展示的slides数量。

在该特征下能够使用Swiper在一些简单的能滑动的区域里，没有slides。在Apps里十分有用。

能够将Swipers嵌套入各种不同的Swiper的slide里，例如垂直的或水平的。

可以将任一的HTML内容放到slide里，不止仅限于图像。

swiper使用硬件加速技术（如果该移动设备支持的话）能够得到良好流畅的动画效果以及优美的外观，尤其是在IOS设备里。

Swiper拥有丰富的API接口。（不过关于中文文档似乎不多，没找着。）能够让开发者生成个人独有的分页器（pagination），上下滑块的按钮以及4个回调函数：onTouchStart,onTouchMove,onTouchEnd,onSlideSwitch。

Swiper在初始化的时候能够接受多个参数以便让其尽可能的灵活。能够配置动画的速度（speed），模式（mode水平抑或垂直的），以及自由模式（free mode）...以及其他..

Swiper从1.7版本开始就变得强大起来了，因为有更多而简单的插件API允许开发者创造属于自己的Swiper插件或通过Swiper的核心创制hooks(挂钩)（该官网处提供了几款优秀的插件Swiper smooth progress, Swiper hash navigation,swiper scrollbar）

Swiper通用性的测试环境：移动端的Safari（iOS5下），Android 2.1+，windows Phone 8,以及最新版本的谷歌浏览器（Chrome），Safari，Firefox，IE10以及欧朋浏览器（Opera）

Swiper 2.x开始，通过DOM动画，而非css transitions兼容IE7以上（需要包含jQuery），因为IE7不支持css3 transitions....简单来说，支持IE7以上版本。

Swiper不依赖像jQuery那样的js类库，因此能够让Swiper更加的小型以及快速。所以Swiper能够很安全地应用诸如jQuery、jQuery Mobile，jQTouch等等其他的js类库。

以上，就是Swiper能够做的，应用以上特征就使用原生属性方法能够快速生成令人惊叹的触控接口以及apps。

三、scroll、touchmove性能优化技巧

1、一般我们在监听scroll事件的时候想到的优化都是节流：即一段时间内只执行一次响应逻辑；但是有时候这种优化手段不满足我们的业务需求。比如我们需要实时的知道位置信息，并且做出响应，如果使用节流的话，响应效果就是一卡一卡的效果。

2、最近看了一篇文章图解浏览器的基本工作原理；在渲染流水线过程的合成这个阶段，文中提到了快速滚动区域与非快速滚动区域的区别。当我们监听滚动事件的时候，本来图层对于滚动事件只要合成线程合成新的一帧就行了，现在却要等主线程处理完我们的定义的事件之后才能继续做它的工作。这里的每一帧时间就相当于合成线程与主线程两个线程的工作时间了，增加了输出新帧的时间。

3、那么有没有优化方法呢？文中提到了使用 passive改善的滚屏性能；顺藤摸瓜，我找到了谷歌测试的一篇文章，尤其是移动端在监听scroll, touchmove的时候利用 passive：true进行性能优化效果显著;前提是你定义的响应事件不要阻止默认事件,即 e.preventDefault()；原理就是合成线程不用再等待主线程的事件处理完了再合成，主线程、合成线程互不干扰，同步进行。那么我前段时间在优化虚拟滚动的时候需要实时拿到e.scrollTop做一些事情，之前发现用手拖动滚动条快速滚动的时候，通过浏览器的调试工具performance录制发现会有长任务的出现阻塞主线程，当时没有很好的解决办法。现在刚好了解这个情况，给它加上这个设置

4、然后发现在快速拖动滚动条的时候的体验确实有所改善。

好了，关于touchmove 谷歌浏览器和谷歌浏览器手里的问题到这里结束啦，希望可以解决您的问题哈！