[webkit-dev] Selection Highlight for Canvas Rendering Object on Mobile Platforms?
hyatt at apple.com
Fri Mar 11 15:35:25 PST 2011
-webkit-tap-highlight-color: transparent is what you need I suspect (at least for iOS).
(hyatt at apple.com)
On Mar 11, 2011, at 10:33 AM, Alex Milowski wrote:
> I'm not sure this is exactly the right place to start, but I'll start
> here since the intersection of Andriod, iOS, and other developers are
> I've been testing some ideas for using the HTML5 canvas on mobile
> platforms versus desktop and I've notice an annoying "feature" on the
> mobile platforms. It is most noticeable on Android but also shows up
> on iOS on the iPad or iPod touch devices.
> The application involves the use of a HTML5 canvas that intercepts
> touch events on the canvas. Areas of a geometric image changes
> shading when touched to represent fractions of the object. On both
> platforms, there seems to be something about focus from the touch even
> that causes a highlight for the whole box containing the canvas
> On iOS, a gray shaded version of the canvas shows up for a very, very
> short period of time. It is inconsistent and depends how long the
> touch gesture is on the canvas. Some very short touch gestures do now
> cause the highlight of the canvas. That may be because it is just too
> short of a period of time to draw the highlight.
> On Andriod, any touch gesture cases a border and highlight around the canvas.
> Both are undesired effects.
> I'm trying to understand why the canvas has special highlight features
> for touch gestures over any other rendering object. Looking at the
> code, the highlight seems to be from the fact that RenderHTMLCanvas
> inherits from RenderReplaced just like RenderImage does. It all seems
> to key off of whether the canvas is selected. But the highlight isn't
> there for mouse clicks on desktop platforms.
> None of the CSS tricks (e.g. -webkit-user-select: none) seem to help
> on mobile platforms.
> It seems to me that on touch-enabled platforms (e.g. mobile) you
> should be able to disable this selection highlight behavior for canvas
> --Alex Milowski
> "The excellence of grammar as a guide is proportional to the paucity of the
> inflexions, i.e. to the degree of analysis effected by the language
> Bertrand Russell in a footnote of Principles of Mathematics
> webkit-dev mailing list
> webkit-dev at lists.webkit.org
More information about the webkit-dev