Context: Web app on MobileSafari/iPad, both full-screen and embedded in iframe
Goal: Technique that provides custom event handlers
Ugly Possibility: Don't prevent a press - make a default press do nothing. Try to use a glass-pane div that catches all touches and doesn't prevent anything on touchstart.
Divs do have default Press behavior (some kind of selection), but perhaps that can be turned off, not via preventDevault but via <body style="-webkit-user-select:none">
? ref
This would mean we'd have to do our own hit-testing to determine what DOM nodes to pass our recognized events to, since we can't just let events bubble up the DOM ancestor chain.
Success: Prevent "default press" behavior entirely through CSS instead of preventDefault. This answer was provided by Safari Technologies Evangelist Vicki Murley over here (registration required)
I see in your stackoverflow post that you say your ultimate goal is that:
"We never want the default MobileSafari Press behavior of "Copy Image" or selecting text."
These behaviors can be disabled in CSS (+ one bonus property, since people often want to turn off the highlight if they're turning off these other behaviors):
/* behavior */ -webkit-user-select: none; /* disable cut copy paste */ -webkit-touch-callout: none; /* disable callout, image save panel */ -webkit-tap-highlight-color: transparent; /* "turn off" link highlight */
Commentary: We assumed that Safari's Press behavior was event-based, not driven by CSS. Calling preventDefault ontouchstart does cancel the press behavior (which is what led us astray, really), but that seems to be an unintended side-effect. Really, Mobile Safari does not execute a "press event" so much as "CSS on press".
Disabling the Press behavior with CSS has allowed us to once again call preventDefault only where and when we actually need it.