简体   繁体   English

如何在IOS / Android中处理触摸事件

[英]how to handle touch events in IOS/Android

I am working on a web application. 我正在开发Web应用程序。 As per the requirement i need to create scrolling images effect when user swipe and on touch (or click) i need to move the specific image to some predefined destination. 按照要求,当用户滑动和触摸(或单击)时,我需要创建滚动图像效果,我需要将特定图像移动到某个预定义的目标位置。

So some stack of images has two events, on touch move it should scroll left or right and on touch start(click) it should move to some distance. 因此,某些图像堆栈有两个事件,在触摸移动时它应该向左或向右滚动,而在触摸开始(单击)时它应该移动到某个距离。

I am unable to handle both events, i want to fire only touch-move event when user swipe and want touch-start to fire when user touch or click. 我无法处理这两个事件,我只想在用户滑动时触发触摸移动事件,并希望在用户触摸或单击时触发触摸启动。

But on swiping, touch start event is also firing up. 但是在滑动时,触摸开始事件也会触发。 Please advice me the solution. 请给我建议解决方案。

Even i have tried click event instead of touch start but still i have same issue. 即使我尝试单击事件而不是触摸开始,但仍然有相同的问题。

您可以在http://developer.yahoo.com/yui/3/scrollview/上查看YUI 3的Scrollview小部件,此外,YUI 3.2还添加了触摸支持。

If you're able to swap out Jquery for something a little smaller and a little more mobile-friendly, Zepto provides a pretty decent alternative. 如果您能够将Jquery换成更小巧,更适合移动设备的东西,则Zepto提供了一个不错的选择。 It's not a drop-in replacement for everything Jquery, but it is surprisingly compatible. 它不是所有Jquery的直接替代品,但令人惊讶地兼容。 It provides basic touch events and CSS animations to make modern web development possible on iOS. 它提供了基本的触摸事件和CSS动画,使在iOS上进行现代Web开发成为可能。

If you're looking for a more complete mobile framework, Spine.js and Spine.Mobile.js sit on top of either Jquery or Zepto, and works very nicely for creating single-page-apps using modern JS development techniques. 如果您正在寻找更完整的移动框架,则Spine.jsSpine.Mobile.js可以位于Jquery或Zepto之上,并且可以很好地使用现代JS开发技术来创建单页应用程序。

IScroll4 also does a nice job of hiding the pain of touch events, and makes things like static headers and footers possible, even in older versions of iOS and Android. IScroll4在隐藏触摸事件的痛苦方面也做得很好,即使在旧版本的iOS和Android中,也可以实现诸如静态页眉和页脚之类的东西。

UPDATE 更新

jqTouchPunch is a bit of a hack, but works surpisingly well... jqTouchPunch有点hack,但是效果很好。

Take a look at jQuery Mobile . 看一下jQuery Mobile Although it is in Alpha stage right now they are planning to release the first version in spring 2011. 尽管目前处于Alpha阶段,但他们计划在2011年春季发布第一个版本。

jQuery Mobile: Touch-Optimized Web Framework for Smartphones & Tablets jQuery Mobile:针对智能手机和平板电脑的触摸优化的Web框架

A unified user interface system across all popular mobile device platforms, built on the rock-solid jQuery and jQuery UI foundation. 在坚如磐石的jQuery和jQuery UI基础上构建的跨所有流行移动设备平台的统一用户界面系统。 Its lightweight code is built with progressive enhancement, and has a flexible, easily themeable design 它的轻量级代码具有逐步增强的功能,并具有灵活,易于主题化的设计

Touch-optimized layouts & UI widgets 触摸优化的布局和UI小部件

Our aim is to provide tools to build dynamic touch interfaces that will adapt gracefully to a range of device form factors. 我们的目标是提供构建动态触摸界面的工具,以适应各种设备尺寸。 The system will include both layouts (lists, detail panes, overlays) and a rich set of form controls and UI widgets (toggles, sliders, tabs) 该系统将同时包含布局(列表,详细信息窗格,覆盖图)以及一组丰富的表单控件和UI小部件(切换,滑块,选项卡)

Demos are here . 演示在这里

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM