Giter Club home page Giter Club logo

any-touch's Issues

移动端无法滚动

使用 preventDefault: false 可以让移动端滚动,不过移动端 tap 需要长按(0.5s左右)才能触发,换成 click 正常,并且 pan 会触发滚动条的滚动。
如果去掉 preventDefault:false tap 正常,不过移动端没饭滚动,click 也无效,换成 tap 以后正常。

我想问一下有没有什么比较好的办法能够在不使用 preventDefault: false 的情况下让滚动条能够正常滚动。我现在是在 pan 事件里面修改 scrollTop,不过这样滚动没有加速度,很不流畅。

代码就差不多下面这个形式,左侧的滚动条在移动端下无法滚动(在不使用 preventDefault: false 的情况下)。

Screen-Recording-2022-05-15-at-21 31 55

<script lang="ts" setup>
const el = document.getElementById('point-list')
const at = new AnyTouch(el)

onMounted(() => {
  at.on('pan', (e) => {
    
  })
  
  at.on('panend', (e) => {
    
  })
})
</script>
<div id="point-list" class="list">
    <div class="item" v-for="(point, index) in pointList" :key="index" @tap="toggleSelection(index)">{{point.name}}</div>
</div>

跟原生事件有冲突

因为插件默认阻止了原生事件,导致滚动条无法滚动,但是设置为true,就感觉很卡顿。跟原生事件冲突了。

如何限制仅两指点击

你好 我使用了any-touch的tap并设置pointLength为2 即支持的触点数为2
实际情况是允许1~2指点击 想请教一下有什么方法可以使其只支持两指吗?
非常感谢

编译的问题

你这里不用babel编译的吗?
假如用到promise,怎么polyfill

发现一个小问题

在pc端直接查看demo时,鼠标 “swipe(滑动)” 操作时,若是往右滑动,会出现滚动条;但若 “用力” 往左滑动时,会导致容器div滑到窗口以外的地方,并且不会产生滚动条,变得 “消失了”

1

vue指令方式使用doubletap默认是false?

在以vue指令方式使用doubletap的时候,发现没效果,然后用了下面代码才可以,问题是,不应该默认是true吗?
importAT (at) { const doubletap = at.get('doubletap') doubletap.disabled = false }

文档错误

image
image

没有 this.on,只有 this.$onthis.$once

文档介绍中 document 拼错大佬修改下

或者, 使用NPM

import AnyTouch from 'any-touch';
const el = doucument.getElementById('box');
const at = new AnyTouch(el);
at.on('pan', e => console.log('e包含位移/速度/方向等信息',e))

vue3指令版的doubletap无效

<script setup>
  const tap= () => {
    // 成功
    console.log('tap')
  }

  const doubletap = () => {
    // 失败
    console.log('doubletap')
  }
</script>

<template>
  <div v-touch @tap="tap" @doubletap="doubletap">test</div>
</template>

缺少afterEach

afterEach中返回所有识别的手势事件,以及at:start/at:end等, 现在的at:after事件中并没有at:start/:at:end事件, 不方便做全部事件的拦截代理.

研究下是在any-event中增加还是在any-touch中增加

panend不触发

version:1.0.5
浏览器:Chrome 86.0.4240.75
操作系统:macOS

panend不触发,并且会在临近结束随机触发一个或多个pannone
截屏2020-10-12 下午1 16 48

另外请问下,演示中的版本是哪个版本啊? 演示版本没这个问题,我用的功能都没问题,项目有点急

[doc] Add the library compatibility information?

First of all, thank you very much for contributing such a good thing.

However, when a library is used as a dependency in a production environment, compatibility issues are important. Have you considered adding relevant information to the documentation?

ios iphone上面的瀏覽器在scrolling的時候touch沒有反應

即係當在html入面有一個長頁面,假設像ios apps一樣左上角有個menu button,但scrolling滾動時按這個button它沒有觸動touch的反應,這個情況只是在iphone的瀏覽器web browser上面發生,例如iphone上的safari和chrome都是一樣發生這個問題

求助一个事情

作者您好,我现在有个急需求,需要参考一下官方的这个实现。可以给我发一下这个demo的代码吗?
image

慢速拖动时 panend 有很大几率不触发

非常棒的手势库,感谢开发者。
我这边的场景是拖动滑块,用户滑动距离不超过某个值时就松手时,让滑块复位。
我这边用 isEnd 判断是否松手。
测试发现慢速拖动时松手后捕捉不到 isEnd 为 true 的事件,专门监听了 panend 发现也没有触发。
官方示例可复现。
2022-04-21 17 08 27

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.