Mobile/TouchScreen/MouseEvents: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
No edit summary
(added current behavior description, formatting)
Line 1: Line 1:
Touchscreen devices have no concept oh "hover" or "mouseover" and "mouseout". This can be a problem for websites with menu systems that depend on "hover" capabilities.
=== Problem ===
 
Touchscreen devices have no concept of "hover" or "mouseover" and "mouseout". This can be a problem for websites with menu systems that depend on "hover" capabilities.


Fennec needs a plan for dealing with these types of sites. Mobile Safari (iPhone) has a special implementation of [http://www.quirksmode.org/blog/archives/2008/08/iphone_events.html mouse events] that allows for some "hover" capabilities. mobile Safari also introduces new types of [http://www.sitepen.com/blog/2008/07/10/touching-and-gesturing-on-the-iphone/ touch-related and gesture-related] events.
Fennec needs a plan for dealing with these types of sites. Mobile Safari (iPhone) has a special implementation of [http://www.quirksmode.org/blog/archives/2008/08/iphone_events.html mouse events] that allows for some "hover" capabilities. mobile Safari also introduces new types of [http://www.sitepen.com/blog/2008/07/10/touching-and-gesturing-on-the-iphone/ touch-related and gesture-related] events.
=== Bugs and Patches ===


Currently, we have several bugs and patches that affect mouse event behavior:
Currently, we have several bugs and patches that affect mouse event behavior:
Line 9: Line 13:
* {{bug|460966}} attachment 383164 (hover fires after a timeout)
* {{bug|460966}} attachment 383164 (hover fires after a timeout)
* there may be more...
* there may be more...
=== Current Touch Behaviors ===
# For chrome, a quick touch will send mousedown/mouseup events to the tapped item.
# For chrome, a touch on a pannable item will result in going into pan mode until the finger is lifted.  If the move was short enough, this will turn into mousedown/mouseup.
# For content, any touch starts a pan of the browser.  If you move sufficiently far, the pan will continue and no extra events will be sent when you lift your finger.
# For content, a touch without moving far will result in a single click.  This will be sent after a short delay.
# If another tap arrives before the click delay is expired, we abort sending a click.  This new click will call a double click handler that performs zooming operations on the canvas.
=== Desired Behaviors ===
# Application of CSS hover style to elements that are tapped
# Sending of additional mouseover/mouseout events based on tap location

Revision as of 16:56, 16 June 2009

Problem

Touchscreen devices have no concept of "hover" or "mouseover" and "mouseout". This can be a problem for websites with menu systems that depend on "hover" capabilities.

Fennec needs a plan for dealing with these types of sites. Mobile Safari (iPhone) has a special implementation of mouse events that allows for some "hover" capabilities. mobile Safari also introduces new types of touch-related and gesture-related events.

Bugs and Patches

Currently, we have several bugs and patches that affect mouse event behavior:

  • bug 492831 attachment 382735 (hover to some elements)
  • bug 492831 attachment 382964 (hover to all elements)
  • bug 460966 attachments 383082 + 383083 (gecko c++ and fennec JS)
  • bug 460966 attachment 383164 (hover fires after a timeout)
  • there may be more...

Current Touch Behaviors

  1. For chrome, a quick touch will send mousedown/mouseup events to the tapped item.
  2. For chrome, a touch on a pannable item will result in going into pan mode until the finger is lifted. If the move was short enough, this will turn into mousedown/mouseup.
  3. For content, any touch starts a pan of the browser. If you move sufficiently far, the pan will continue and no extra events will be sent when you lift your finger.
  4. For content, a touch without moving far will result in a single click. This will be sent after a short delay.
  5. If another tap arrives before the click delay is expired, we abort sending a click. This new click will call a double click handler that performs zooming operations on the canvas.

Desired Behaviors

  1. Application of CSS hover style to elements that are tapped
  2. Sending of additional mouseover/mouseout events based on tap location