tr888
unread,Jun 17, 2010, 8:02:24 AM6/17/10Sign in to reply to author
Sign in to forward
You do not have permission to delete messages in this group
Either email addresses are anonymous for this group or you need the view member email addresses permission to view the original message
to iPadWebDev
I am trying to find out what, if anything, happens to the mouse-to-
touch event mapping/emulation when an element has -webkit-user-
select:none CSS applied to it. I looked at the iPad at the Apple
store recently before discovering -webkit-user-select:none, so I don't
know the full effects of this CSS. Maybe I'll have a iPad soon :-)
Before the above CSS was applied to the AREA, this is the behavior I
noticed on the iPad at the Apple store:
1. The web page has both an onMouseOver and a click eventhandler on
the AREAs of the image-map.
2. When user taps on an area (i.e. finger-down and then rapidly up,
just like a mouse-click) the onMouseOver event is fired but the click
event is suppressed. This causes the tooltip to be displayed and
remain there until another area of the image is tapped.
3. When the user touches down on an area and keeps the finger there,
the area is selected.
While I understand that this is the touch world not the mouse world,
such rendering of a "legacy" web page by Safari is rather clunky and
arbitrary -- that's not how tooltips are supposed to work, and the
click event is gone. iPad Safari's "standard" emulation of mouse
events (i.e. standard = where you are attaching eventhandlers to
onMouseOver and Click rather than intercepting the touchstart,
touchmove, touchend events at a lower level) really requires the
developer to choose between mouse-over and click eventhandlers. And
it breaks many an existing web page.
I'd like to have both a tooltip for when the element is touched that
would say what it is, or say what will happen if you tap on it; and a
dialog that is opened by a tap on the element that would give the user
much more detailed information about it.
Apple iOS makes the touch a select, but perhaps Safari gives the
developer a way to disable that mapping so that touching an element on
screen becomes the counterpart to 'hover'. Maybe -webkit-user-
select:none is a simple way to cause this behavior? I haven't been
able to get back to the Apple store to check it out.
Does disabling user-select in CSS change the way Safari simulates
mouse events on elements with both onMouseOver and Click handlers?
Does the click event fire?
Thanks