问题标签 [touchmove]

每当我敢于自己编写代码时，stackoverflow 已经帮助了我很多，但是今天我无法通过找到的答案弄清楚一些事情。

我有一个简单的 jQuery 脚本，可以在每个浏览器和 Android 上完美运行。只有我亲爱的 Apple 搞砸了（iPad 和 iPhone）。

我有一个粘性标题，经过一点滚动后会淡入。我认为我需要某种touchmove活动，但我尝试过的任何方法都没有奏效。

您能否简要解释一下我必须如何更改这段代码才能使其正常工作？

非常感谢您的帮助，我喜欢这个论坛的存在！

kvn

PS如果需要，这里是CSS：

我需要重现惯性触摸移动，如果我做简单的抛物线方程，移动似乎与在 Android（和 iPhone）上观察到的不同。

他们使用的方程式是什么？

没关系，我意识到'JSON.stringify（evt）'不会打印出事件对象中的数据？？？？

原始问题：

我有

当我看到警报时，“evt”为空白。所以所有这些帖子都像这样一个iphone 的 safari touchmove 事件不起作用，说要获得“originalEvent”不适用于我，因为在 evt 中根本没有什么可看的。

我如何让“evt”在其中包含触摸数据，以便我可以使用类似的代码获取触摸位置

?

注意：下一行代码有以下鼠标事件，效果很好

I have a fixed element which covers the entire screen and need scrolling.

IOS has what people call 'rubbing banding' for an example of this behavior you can take a look at these gifs:

http://blog.christoffer.me/six-things-i-learnt-about-ios-safaris-rubber-band-scrolling/

The problem is that when rubber banding occurs and pulls my fixed element down(revealing the content it overlays) there is a chance a users finger might end up on the content which is being overlay-ed.

When this happens all touchmove event will trigger not on my fixed element that covers the screen but on the body that my fixed element is overlaying.

I know you can prevent the body from scrolling in a maner like this:

But this is a solution to prevent scrolling.

This is not the solution because once the touchmove event has triggered on the overlay-ed content once, it will only stop if a user removes their finger from the screen.

In short a user might scroll my fixed element, reach the top making the rubber banding kick in and swipe on the body instead of the fixed element because the rubber banding reveals the body.

Even if the element pops back into place after the rubber banding has taken place the touchmove event is still stuck on the body element until the user removes his finger from the screen.

I am pretty lost on what to do here. Somehow disabling the touchmove event for the body seems like a good idea but my fixed element is inside there and it still needs scroll abilities.

Any thoughts or tips on how to handle this?

Edit:

A simply jsfiddle:

https://jsfiddle.net/pq88zLLx/1/

This only works on IOS though and only if you swipe into the content that the rubber banding is revealing.

我是一名平面设计师，使用最新的 Edge Animate CC 2015，代码技能有限。我想通过在信息亭触摸屏（由 Windows 触摸屏笔记本电脑运行）中使用触摸/鼠标移动舞台（实际上是基于一年的时间线）来实现水平视差效果.我不希望任何滚动条出现在屏幕上）。我在 YouTube ( https://www.youtube.com/watch?v=wUJ63cBwS1I ) 上观看了 Paul Trani 的视差效果视频并尝试了以下操作：

在compositionReady代码窗口...

在touchmove代码窗口上：

但它不适用于touchmove事件。但是，当我像保罗的原始视频一样将最后一行放在mousemove代码窗口中时，它照常工作。

作为记录，我安装了以下脚本：

jquery-ui-1.10.4.min.js
jquery-mobile-1.4.2.min.js
jquery.ui.touch-punch.min.js
jquery-2.0.3.min.js

您是否认为不使用任何导致此问题的更新脚本？某些浏览器/平台是否存在任何 HTML 5 不兼容问题？

我还尝试了来自 adobe 论坛的以下代码...

但是 Edge Animate CC 在第一行发现系统语法错误。有什么建议可以在最新的 Edge Animate 中采用吗？我尝试了“舞台”或“窗口”但失败了。

我有一个跟踪touchmove事件的网页，允许用户在屏幕上拖动元素 - 工作正常。

当用户移动它时，我在移动元素中动态替换 html - 替换 html 工作正常。

问题是，如果用户通过触摸内部 html（被替换）进行拖动，那么一旦内部 html 被替换（直到下一个 touchstart），拖动（触摸移动事件）就会停止。

事件侦听器位于外部容器上，而不是被替换的 html，所以我认为它应该继续捕获事件。

mousemove事件也不会发生此问题。

我做了一个 jsfiddle 演示。使用鼠标应该可以正常工作并且不会发生任何问题（mousemove 事件）。当您使用触摸设备（或使用 Chrome 的触摸模拟：更多工具 > 传感器 > 触摸 > 强制启用）时会出现此问题。

https://jsfiddle.net/dmdjvd7e/1/

相同但使用 jquery：https ://jsfiddle.net/a2fwkr4e/6/

在演示中，您可以拖动屏幕周围的红色圆圈。圆圈内的黄色框每秒更换一次。如果您触摸红色（不是黄色），那么一切都会正常工作。如果您触摸黄色，那么一切都会正常工作，直到黄色框被替换（每秒），之后您将不会移动元素，直到您再次触摸开始。

这是预期的浏览器行为吗？为什么mousemove不同？有没有办法解决这个问题，同时仍然允许我替换 html？

如果我不替换内部 html，而只是修改它或只是替换文本而不是 html 元素，那么就没有问题。但是，我希望能够替换 html（根据现有的应用程序要求）。

...

包含完整性的代码（与 jsfiddle 相同）：

css/html:

js：

使用 Chrome 62 和 Firefox 56（均在 Windows 10 上）和 Chrome 60 (Android N) 以及 Safari/webkit 602.1 (iPhone 6) 进行了测试。

我有一个非常简单的代码，用于通过触摸屏拖动/移动元素。代码工作正常，唯一的问题是一个常见问题，但无论我如何尝试，我都无法修复从接触点拖动的代码。相反，无论初始触摸位置如何，每次移动都从元素的边缘开始。

我看到了一些建议，但都失败了。我希望更小更简单的代码会吸引一个简单的修复。

这是JavaScript：

CSS

我有一个带有分屏滑块的网站，我想让它对移动设备友好。我有一个 addeventlistener 'mousemove'，它允许滑块来回移动，但我也想让它触摸激活。

我尝试用“pointermove”和“touchmove”替换“mousemove”，但没有任何改变。手机还是不行，求大神帮忙。codepen显示了我在我的网站上拥有的示例。

我有一个目标视图（蓝色视图和红色视图用于左上角）。我试图用手指移动这个视图。如果视图不旋转，一切都很好。 但是当我旋转视图并移动时，第一次很好。但是从第二次开始，从手指位置弹回视图就很奇怪了。

我正在使用连接来组合变换。

我不熟悉变换，数学不是我的好。旋转真的会影响平移（移动）吗？还是我误解了什么？如何解决？

我在 iphone 上有一个非常大的错误，它使页面无法使用，我无法解决它。我也找不到有关此问题的任何主题。

我有以下屏幕：

中间有一个div，设置-webkit-overflow: auto;为在这个div里面平滑滚动。滚动工作非常顺畅。

但只有在我touchmove对这个 div 之外的另一个元素执行 a 之前。如果我这样做并尝试再次滚动滚动容器，它会被冻结并且根本不会移动。在我点击滚动容器几次后，它再次滚动。它正在失去滚动容器的滚动焦点并试图滚动父级。

所以，如果我做这样的运动：

这看起来像这样：

注意：我只是从底部容器到溢出 div 进行一次触摸移动。松开手指然后尝试再次滚动后，它仍然滚动父 div。

我做了一个简短的例子，所以你可以在这里用你的 iphone/phone 看看。

-webkit-overflow: auto此问题仅在使用正常时才会出现，overflow: scroll它始终可以正常工作，但是是的……您知道这种滚动感觉有多迟钝。

当您单击/点击容器时，有什么方法可以强制滚动焦点在所需容器中-overflow-scrolling: touch;？