2012-03-08 31 views
5

parte de mi página requiere un doble clic, lo que tiene el efecto indeseable de que a veces el usuario inadvertidamente resalta parte del texto de la página.Detener texto HTML resaltado

Realmente es un poco desordenado, pero ¿hay una manera ordenada de evitar que esto suceda, que no sea el uso de imágenes en lugar de texto?

Gracias

Respuesta

11

Aquí está el css deshabilita la selección de texto. How to disable text selection highlighting using CSS?

-webkit-touch-callout: none; 
-webkit-user-select: none; 
-khtml-user-select: none; 
-moz-user-select: none; 
-ms-user-select: none; 
-o-user-select: none; 
user-select: none; 
+1

¡Lo suficientemente bueno para mí! Gracias :) – CompanyDroneFromSector7G

+2

¿Por qué agregaste -webkit-touch-callout: none ;? –

2

como se sugiere @arunes, se puede hacer esto con CSS para la mayoría de los navegadores. Sin embargo, he leído que esto no funciona con IE 6-8 (al menos). Así que por eso, es posible que tenga algo como:

document.getElementById("divDoubleClick").onselectstart = function() { return false; }; 
2

Esto funciona para mí

como se sugiere poner los estilos css en

body, div 
{ 
    -webkit-touch-callout: none; 
    -webkit-user-select: none; 
    -khtml-user-select: none; 
    -moz-user-select: -moz-none; 
    -ms-user-select: none; 
    -o-user-select: none; 
    user-select: none; 
} 

también añadir estos a permitir la selección dentro de los campos de formulario

input, textarea, .userselecton 
{ 
    -webkit-touch-callout: text; 
    -webkit-user-select: text; 
    -khtml-user-select: text; 
    -moz-user-select: text; 
    -ms-user-select: text; 
    -o-user-select: text; 
    user-select: text; 
} 

Tenga en cuenta que no es necesario -moz-none o que no se puede volver a habilitar para las entradas.

para IE agrego

<script type="text/javascript"> 
    window.addEvent("domready", function() 
    { 
     document.addEvent("selectstart", function(e) 
     { 
      if ((e.target.tagName == "INPUT") || 
      (e.target.tagName == "TEXTAREA") || 
       (e.target.hasClass("userselecton"))) 
      { 
       return true; 
      } 
      return false; 
     }); 
    }); 
</script> 

Esto no sólo evita la selección de texto plano, pero permite la selección de InputFields y el elemento y se pone la clase en userseleton.

+0

¡Gracias información útil! – CompanyDroneFromSector7G

Cuestiones relacionadas