WP7 + HTML5 - Cómo evitar que un lienzo sea seleccionado/resaltado

Question

Estoy tratando de escribir una aplicación HTML 5 simple para Windows Phone 7/7.5. Tengo una página HTML5 con un lienzo casi del tamaño de la pantalla. Cuando hago clic/toco en la pantalla, se selecciona el lienzo. No quiero ese comportamiento, pero aún quiero poder hacer clic/tocar varios controles. ¿Hay alguna manera de no tener ese comportamiento? A continuación se muestra el enlace de una captura de pantalla que muestra el efecto.

Me trataron de eliminar ese comportamiento el uso de CSS en el cuerpo. Nada ha funcionado hasta ahora.

body { 
    /* disable selections/cut copy paste actions */ 
    -moz-user-select: none; 
    -khtml-user-select: none; 
    -webkit-user-select: none; 
    -ms-user-select: none; 
    user-select: none; 

    /* disable callout, image save panel on long press */ 
    -webkit-touch-callout: none; 

    /* "turn off" link highlight, good for custom pressed states */ 
    -webkit-tap-hightlight-color: transparent; 
} 

Gracias de antemano por la ayuda!

Answer 1

Martin mencionó que el siguiente ejemplo no muestra el comportamiento más destacado: http://ie.microsoft.com/testdrive/Mobile/Performance/HamsterDanceRevolution/Default.html

Así que he hecho un poco de excavación y se dio cuenta que el ejemplo anterior se une eventos al objeto de ventana. Lo tengo a los siguientes tres modificaciones línea del archivo "cinético-v3.8.4.js":

(1)
this.container.addEventListener (baseEvent, manipulador, false);
->
window.addEventListener (baseEvent, handler, false);

(2)
this.container.addEventListener ('mousedown', function (evt)
->
window.addEventListener ('mousedown', function (evt)

(3)
this.container.addEventListener ('mousedown', function (evt)
->
window.addEventListener ('mouseup', function (evt)

Después de esta modificación, el lienzo sigue reaccionando y el resaltado no deseado se ha ido.

Saludos, Luis

Answer 2

No es posible desactivar este resaltado gris. Ver esta pregunta relacionada:

Windows Phone 7 Browser - Turn off the gray shading when links are clicked

La propiedad CSS está configurando, -webkit-tap-hightlight-color, es webkit específica, por lo que funcionará en Android y iOS. Hasta que WP7 tenga un equivalente, ¡estás atascado con esto!

Answer 3

Para WP8 agregaron soporte:

<meta name="msapplication-tap-highlight" content="no"/> 

Fuente: http://sgrebnov.blogspot.de/2012/10/windows-phone-8-for-html5js-developers.html

Answer 4

Añadir una etiqueta meta en la que la cabeza de la sección que ofrece el archivo html.

<meta name="msapplication-tap-highlight" content="no" /> 

Debería funcionar.

Saludos, pravesh

Answer 5

Adición de una etiqueta meta en las cabeceras de hecho fijados este problema

favor agregue este

<meta name="msapplication-tap-highlight" content="no"/>